Angular JS做一个字数限制和提示

• HTML
  
  • na-app:指定当前层级及以下层级属于AngularJS应用
  • na-controller:指定controller名字,和JS代码中的controller名字做绑定
  • ng-model:html中指定属性值,并把这个属性值和控件的value做绑定

<div class="span12 field-box textarea" ng-app="myApp" ng-controller="myCtrl">
    <label>备注:</label>
    <textarea class="span9" ng-model="name"></textarea>
    <span class="charactersleft">已经输入{{length}}个字符总共可以输入100个字符</span>
</div>

• JS
  
  • angular.module(“ng-controller”,[]);//创建一个module
  • $watch(‘监听的属性’,callback)//监听某个属性的改变

/*以下是我添加的数据*/
/*监听文本框内容的变化*/
$(function () {
    var app = angular.module("myApp", []);
    app.controller("myCtrl", function ($scope) {
        $scope.length = 0;
        $scope.$watch('name', function (newValue, oldValue, scope) {
            $scope.length = newValue.length;
            if ($scope.length > 100) {
                $scope.name = oldValue;
            }
        });
    });

})