雙向綁定

時間 2019-11-16

標籤雙向綁定简体版

原文原文鏈接

　　雙向綁定是angularJS的重要特性，也就是數據影響視圖，視圖也會影響數據。html

一個M影響V最簡單的示例就是這樣：angularjs

<div ng-controller="CounterCtrl">
    <span ng-bind="counter"></span>
    <button ng-click="counter++">increase</button>
</div>
function CounterCtrl($scope) {
    $scope.counter = 1;
}

這個例子很簡單，毫無特別之處，每當點擊一次按鈕，界面上的數字就增長一。app

下面，咱們舉一個V影響M的例子：spa

<!DOCTYPE html>
<html ng-app>
<head>
    <meta charset="utf-8">
    <title>ng-model directive</title>
</head>
<body ng-controller="HelloController">
<div>
    <p>雙向綁定</p>
    <input ng-model="greeting">
    <p>Hello {{greeting || "World"}}</p>
    <button ng-click="init()">重置</button>
    <hr>
</div>
 
<script src="../lib/angularjs/1.2.26/angular.min.js"></script>
<script>
    function HelloController($scope) {
        $scope.init = function() {
            $scope.greeting = "Hello";
        }
    }
</script>
</body>
</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。