使用AngularJS指令实现双向绑定,即将视图(View)和控制器(Controller)之间的变化相互联动。
在AngularJS中,双向绑定是通过在指令中使用$scope.$watch()方法实现的。下面是一个例子:
HTML代码:
{{name}}
JS代码:
angular.module('myApp', [])
.controller('myCtrl', function($scope) {
$scope.name = "John";
});
在上面的例子中,ng-model指令用于绑定输入框的值到控制器$scope中的name变量上,同时{{name}}指令用于将控制器$scope中的name变量值绑定到h1标签中。
这样,当用户在输入框中输入内容时,$scope.name变量值也会随之更新,并且在视图中实时显示。
这就是AngularJS指令实现的双向绑定的原理。