ng-model 指令用于绑定应用程序数据到 HTML 控制器(input, select, textarea)的值。ng-model 指令ng-model指令可以将输入域的值与 AngularJS 创建的变量绑定。AngularJS 实例div ng-appmyApp ng-controllermyCtrl名字: input ng-modelname/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope) {$scope.name John Doe;});/script尝试一下 »双向绑定双向绑定在修改输入域的值时 AngularJS 属性的值也将修改AngularJS 实例div ng-appmyApp ng-controllermyCtrl名字: input ng-modelnameh1你输入了: {{name}}/h1/div尝试一下 »验证用户输入AngularJS 实例form ng-app namemyFormEmail:input typeemail namemyAddress ng-modeltextspan ng-showmyForm.myAddress.$error.email不是一个合法的邮箱地址/span/form尝试一下 »以上实例中提示信息会在ng-show属性返回true的情况下显示。应用状态ng-model指令可以为应用数据提供状态值(invalid, dirty, touched, error):AngularJS 实例form ng-app namemyForm ng-initmyText testrunoob.com Email: input typeemail namemyAddress ng-modelmyText required p编辑邮箱地址查看状态的改变。/p h1状态/h1 pValid: {{myForm.myAddress.$valid}} (如果输入的值是合法的则为 true)。/p pDirty: {{myForm.myAddress.$dirty}} (如果值改变则为 true)。/p pTouched: {{myForm.myAddress.$touched}} (如果通过触屏点击则为 true)。/p尝试一下 »CSS 类ng-model指令基于它们的状态为 HTML 元素提供了 CSS 类AngularJS 实例styleinput.ng-invalid {background-color: lightblue;}/stylebodyform ng-app namemyForm输入你的名字:input namemyAddress ng-modeltext required/form尝试一下 »ng-model指令根据表单域的状态添加/移除以下类ng-emptyng-not-emptyng-touchedng-untouchedng-validng-invalidng-dirtyng-pendingng-pristine