AngularJs之三

一.angularJs的指令模型ng-model指令

ng-model 指令 綁定 HTML 元素 到應用程序數據。
爲應用程序數據提供類型驗證（number、email、required）。
爲應用程序數據提供狀態。
爲 HTML 元素提供 CSS 類。
綁定 HTML 元素到 HTML 表單。

<div ng-app="myapp" ng-controller="mycc">
    名字: <input ng-model="name">
</div>
<script>
var app = angular.module('myapp', []);
app.controller('mycc', function($scope) {
    $scope.name = 「宋小寶";
});
</script>

二.angularJs的指令模型ng-model指令：雙向綁定

在修改輸入域的值時， AngularJS 屬性的值也將修改：

<div ng-app="myapp" ng-controller="mycc">
    名字: <input ng-model="name">
    <h1>你輸入的名稱是：{{name}}</h1>
</div>

<script>
var app = angular.module('myapp', []);
app.controller('mycc', function($scope) {
    $scope.name = 「宋小寶";
});
</script>

三.angularJs的應用

<div ng-app="myapp" ng-controller="myctrl">
    姓：<input type="text" ng-model="xing"><br>
        名：<input type="text" ng-model="ming">
        <h1>你的姓名是：{{xing+""+ming}}</h1>
</div>
<script>
    var app=angular.module("myapp",[]);
    app.controller("myctrl",function($scope){
         $scope.xing="宋";
         $scope.ming="小寶";
    })
</script>

實例說明：
模塊(m)：var app = angular.module('myApp', []);
控制器(c)：app.controller("myctrl",function($scope){   })
視圖(v)：就是html區域

四.angularJs模型

ng-model 指令用於綁定應用程序數據到 HTML 控制器(input, select, textarea)的值。
ng-model 指令能夠將輸入域的值與 AngularJS 建立的變量綁定

<div ng-app="myApp" ng-controller="myCtrl">
    名字: <input ng-model="name">
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.name = 「花果山美猴王";
});
</script>