菜雞學AngularJS 01- 創建WEBAPP、創建控制器、創建視圖

1:在頁面里面引入Angular Js

PS:引用可以用網絡路徑也可以是本地路徑
<head>
    <script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
</head>

2:創建WebAPP和控制器

PS:每個獨立頁面都被看成一個獨立的WebAPP,每個WebAPP可以有多個controller控制器。
ng-app = “ ” 規劃WebAPP的作用域。
ng-controller = “ ” 劃定 WebApp 中的控制器的作用域。
angular.module('WebAPP作用域名稱', [ ]);
app.controller('Controller控制器名稱', function($scope) { 表達式 });
$scope 不可修改 控制器對象
<body>
    <div ng-app = "TestApp">
        <div ng-controller="TesrController">
            
        </div>
    </div>
</body>
<script>
    var app = angular.module('TestApp', []);
    app.controller('TesrController', function($scope , $http) {
        $scope.message = "Hello, Angular JS.";
    });
</script>

3:創建視圖

PS:通過{{ }} 控制器綁定模型視圖
<body>
    <div ng-app = "TestApp">
        <div ng-controller="TesrController">
            <p>{{message}}</p>
        </div>
    </div>
</body>
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容