您的位置:首页 > Web前端 > AngularJS

angula 之 ngModel

2015-10-15 00:00 906 查看
对于ngModel

提供 ngModelController

为ngModel提供api

包含 data-binding,validation,css updates, value formationg, parsing 等功能

// 方法
$render()  // 需要被重写  默认是 noop 函数。
$setViewValue()
$setValidity()
$commitViewValue()
$isEmpty()
$rollbackViewValue()
$setDirty()
$setPristine()
$setTouched()
$setUntouched()
$validate()

// 属性
$formatters
$viewValue
$error
$dirty
$invalid
$modelValue
$name
$options
$parsers
$pending
$pristine
$render
$untoicued
$valid
$validators
$viewChangeListeners

等等、


对于 ngModal 的理解。如果是调用了angular 内部改写过的html 控件。对于绑定的ng-model 的控件,都会共享这个数据的结果。

例如

<input type="text" ng-model="test"/>
<textarea ng-model='test'></textarea>

这个时候,两者同时改变的时候都会触发两者的变化。

但是

<p ng-model="test"></p>

这个时候,由于angular 内部没有重写对于p标签的重写,导致ng-model 对这个控件是没有作用的。

ps: 可以通过ng-bind指令去解决这个问题。

但是可以通过万能的指令去解决这个问题。

.directive('testDirc',function(){
return {
restrict:'A',
require:'?ngModel',
link:function(scope,element,attrs,ngModel){
if(!ngModel){
return;
}

ngModel.$render = function(){
element.html(ngModel.$viewValue);
}
}
}
})

这个时候就有用了。

<p ng-model="test" test-dirc></p>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  angular