前言：為什么要用AngularJS？ 相信用過.NetMVC的人都知道用rezor綁定數據是一件很爽的事情，C#代碼直接在前台頁面中輸出。然后這種比較適用於同步請求。 當我們的項目離不開異步請求綁定數據的時候，AngularJS的強大就能感受出來了！ 下面大家就花十分鍾的時間了解一下AngularJS的數據綁定吧！Let‘s go
一、 AngularJS腳本引用
就跟我們平常引用一個jquery一樣
二、 ng-App配置
什么是ng-App，官方文檔的解釋是這樣的The ng-app directive tells AngularJS that the <div> element is the "owner" of an AngularJS application. 就是說加了這句以后代表AngularJs應用程序加載了這個頁面
三、 ng-controller配置！
ng-controller就是用來做頁面渲染的一個控制器
四、 ng-repeat【數據綁定利器！】
<!DOCTYPE html> <html> <head> <script src='javascripts/jquery-1.11.3.min.js' type="text/javascript"></script> <script src='javascripts/angular.js' type="text/javascript"></script> </head> <script> var mainApp = angular.module('mainApp', []); mainApp.controller('studentController',function($scope){ $scope.student=null; //這邊定義一個json的對象 $scope.student=[{'name':'王小明',"age":"22"},{'name':'李小剛',"age":"30"}]; }); </script> <body ng-app="mainApp"> <h1><%= title %></h1> <div ng-controller="studentController"> <!--遍歷對象--> <div ng-repeat="item in student"> <h1 ng-bind="item.name"></h1> <p ng-bind="item.age"></p> </div> </div> </body> </html>
五、 結果
六 總結
到現在為止你已經掌握angularjs基本的數據綁定，介於一些人尚未用過angularjs，所以這一篇文章就讓大家簡單的了解一下angularjs的方便之處。
下一篇文章我將會介紹在項目開發中百分百會用到的東西，如果覺得對你有用請點個推薦吧。