核心提示:AngularJs通过$scope和$watch可以检测数据的变化,从而提醒用户进行正确的操作,具体方法如下:01 !DOCTYPE html02 html lang=en03 head04 meta...
AngularJs通过$scope和$watch可以检测数据的变化,从而提醒用户进行正确的操作,具体方法如下:
01 <!DOCTYPE html>
02 <html lang="en">
03 <head>
04 <meta charset="UTF-8">
05 <title>Title</title>
06 <style type="text/css">
07 .ng-cloak{display:none;}
08 </style>
09 </head>
10 <body ng-app="app" ng-controller="ctrl" ng-cloak class="ng-cloak">
11 <input type="text" ng-model="data1" />{{error1}}
12 <input type="text" ng-model="data2.title">{{error2}}
13 </body>
14 </html>
15 <script type="text/javascript" src="../js/angular.min.js"></script>
16 <script type="text/javascript">
17 var m = angular.module('app', []);
18 m.controller('ctrl', ['$scope', function($scope){
19 $scope.data1 = 'zym';
20 $scope.$watch('data1', function(n, o){
21 console.log(n);
22 $scope.error1 = n.length>3 ? '最多3个字' : '';
23 })
24
25 $scope.data2 = {'title':'zym'};
26 $scope.$watch('data2', function(n, o){
27 console.log(n);
28 $scope.error2 = n.title.length>3 ? '最多三个字' : '';
29 }, true);
30 }]);
31 </script>
$scope.$watch的第一个参数是要监听的变量数据,回调函数里边的第一个参数是新数据,第二个参数是旧数据。
如果监听的变量数据是一个对象,那么$scope.$watch还需要加入第三个参数true。


