module

• angularJS--模塊化編程 可以調(diào)用 .config .run .controller .filter .directive .factory 每一塊都可以設(shè)置配置項(xiàng)，run（內(nèi)部 http一些服務(wù)），控制器，過濾器，自定義指令，自定義服務(wù)
• 執(zhí)行順序：config->run->controller

controller

filter 過濾器

• limitTo
• orderBy
• data
• currency

config

• 運(yùn)行angular之前想要配置一些什么東西 都可以寫在config里面（最先執(zhí)行）

服務(wù)

• $http

• 如何自定義一個服務(wù)
  factory("abc",function(){
  return {name:"fuwu-abc"}
  })

  angular.module("myapp",[],factory("abc",function(){
      return {name:"fuwu-abc"}
  }).controller("ctrl",function(abc){
      console.log(abc.name)
  })
  

ngRoute

bower install angular-route
angular.module("myapp",["ngRoute"]).config(function($routeProvider){
    $routeProvider.when("/aa",{
          templateUrl:"./views/phone.html"
    })
})

ng-view 單頁面應(yīng)用 實(shí)現(xiàn)頁面之間過渡的一個動畫

指令

• 自定義指令
  <div abc>組件/123456</div>//有四種指定指令的方式：類，注釋，標(biāo)簽（不常用有兼容性問題）組件:只需要放個指令就可以實(shí)現(xiàn)一些功能模塊
  angular.module("myapp",[]).directive("abc",function(){
  return{
  restrict:"ECMA",//元素 class 注釋 屬性
  template:"<div>div</div>",//模版，可能要替換的東西會比較復(fù)雜，那我們用一個外部文件去替換templateUrl:"demo.html" 這里運(yùn)用了ajax請求 ajax不能跨域，解決方法：1.jsonp 2. 代理
  replace:true,//如果替換要求文件內(nèi)只有一個根元素----不常用
  transclude:true,//保留原來div內(nèi)的內(nèi)容 內(nèi)容放置的位置可以在要放的標(biāo)簽上加ng-transclude
  scope:{},//每一個指令都是獨(dú)立的 scope:true/false = @ &(可以獲取到標(biāo)簽上menu="123"的值 123)
  link:function(a,b,c){ //($scope)這個字段可以使指令獨(dú)立 不受外部控制器的影響，通過link函數(shù)定義自己的控制器，控制器可以嵌套，數(shù)據(jù)就近訪問
  a.abc="指令的scope"

           }
       }
  })
  

angular 路由的原理

• 統(tǒng)一域名下a頁面訪問b頁面的東西，a->b 用ajax 在地址欄留不下任何記錄但是搜索引擎不友好（本質(zhì)也是爬蟲）不能前進(jìn)后退
• 如果想要利用ajax獲取到頁面的內(nèi)容，還能在地址欄上留下記錄
  var url=location.href;
  if(url.indexOf){}
• angular 路由
  • ng-view 所有ajax獲取到的內(nèi)容放在ng-view的標(biāo)簽下
  • ngRoute 提供的一個服務(wù) $routeProvider, when()
    angular.module("myapp",["ngRoute"])
    .config(function($routeProvider){
    $routeProvider.when("/",{
    templateUrl:"demo1.html"
    }).when("/list:id",{
    templateUrl:"list.html",
    controller:"list"
    })
    }).controller("list",function($scope,$routeParams){
    $scope.id=$routeParams.id
    })

動畫模塊 ngAnimate

• 命令行安裝 bower install angular-ngAnimate
  1. bower 下載路由 引入到頁面當(dāng)中
  2. 將路由提供的模塊依賴到主模塊中 ngRoute
  3. 配置路由 在主文件當(dāng)中配置路由
  4. config $routeProvider服務(wù)
  5. $routeProvider.when("路徑",{templateUrl:"文件路徑"})