paulwong

          淺釋ANGULARJS

          1. 導入ANGULARJS庫
            <script src="lib/angular/angular.js"></script>

          2. 通知ANGULARJS引擎開始工作,并設置作用域
            <html ng-app>

          3. 運行一個CONTROLLER,如果里面有設置模型的數據的,就將模型保存下來,此CONTROLLER僅僅可以存取BODY內的所有數據
            <body ng-controller="PhoneListCtrl">

          4. CONTROLLER代碼,其中$scope是ANGULARJS管理的對象,這時就注入到此方法中
            function PhoneListCtrl($scope) {
              $scope.phones = [
                {"name": "Nexus S",
                 "snippet": "Fast just got faster with Nexus S."},
                {"name": "Motorola XOOM™ with Wi-Fi",
                 "snippet": "The Next, Next Generation tablet."},
                {"name": "MOTOROLA XOOM™",
                 "snippet": "The Next, Next Generation tablet."}
              ];
            }

          5. 如遇到雙大括號的標簽,則運行里面的表達式,并將結果更新至DOM顯示
            {{phone.name}}

          6. 根據數組中ITEM的多少,產生相對應的LI標簽
            <ul>
                <li ng-repeat="phone in phones">
                  {{phone.name}}
                <p>{{phone.snippet}}</p>
                </li>
              </ul>

          7. 此標簽(指令)會將INPUT的VALUE值與一個叫QUERY的對象進行雙向綁定,任何一方的改變都會同步至對方
            <input ng-model="query">

          8. 使用外部數據,$http是ANGULARJS管理的提供HTTP訪問服務的對象,$scope.phones是往$scope里面新增一個phones,并賦值
            function PhoneListCtrl($scope, $http) {
              $http.get('phones/phones.json').success(function(data) {
                $scope.phones = data;
              });

            }

          posted on 2014-06-08 11:47 paulwong 閱讀(274) 評論(0)  編輯  收藏 所屬分類: ANGULARJS

          主站蜘蛛池模板: 石阡县| 和平区| 五台县| 化隆| 和硕县| 民权县| 当雄县| 淳安县| 禹城市| 宾川县| 德钦县| 巍山| 凉山| 永善县| 济源市| 桐乡市| 乡宁县| 西宁市| 曲靖市| 沅江市| 缙云县| 和林格尔县| 建昌县| 新和县| 咸丰县| 克什克腾旗| 班戈县| 高邮市| 岢岚县| 文登市| 鄂温| 汝州市| 庄浪县| 集安市| 遂平县| 汉寿县| 盐津县| 六枝特区| 彭泽县| 寿宁县| 伊川县|