AngualarJS中$watch

最新推荐文章于 2019-04-27 17:35:21 发布

Future_Master_L

最新推荐文章于 2019-04-27 17:35:21 发布

阅读量186

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_40321535/article/details/78788667

本文介绍了一个使用AngularJS实现的简单示例，通过$watch服务来监控输入框内容的变化，并根据输入长度实时更新错误提示信息。该示例展示了如何在控制器中设置监视器以响应模型变化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/angular.min.js"></script>
    </head>

    <body ng-app="Mapp" ng-controller="Mctrl">
        标题:<input type="text" ng-model="title" id="" value="" />
        <br />{{error}}
        <script>
            var m = angular.module("Mapp", [])
                m.controller("Mctrl", function($scope,$filter) {
                    $scope.title="";
                    //监视器,监视title的长度
                    //a是实际的title
                    //b是上一次的值(b与a一样时不会触发)
                    $scope.$watch("title",function(a,b){
                        $scope.error = a.length>3?'标题长度不可超过三位':'';
                        alert(b)
                    })

                })
        </script>
    </body>

</html>