NgModelController: $setViewValue,$render,Formatter, Parser
来源:互联网 发布:学生成绩管理系统c语言 编辑:程序博客网 时间:2024/06/05 14:28
NgModelController为ngModel directive提供了API。这个controller包含了关于data-binding,validation,css update, value formatting and parsing的相关service.该controller本意上设计不包含任何处理DOM渲染或者侦听DOM events的逻辑。这些DOM相关的逻辑应该由其他使用ngModelController做databinding的directive来完成。Angular为几乎所有的input elements提供这个DOM逻辑。
$render()
该函数在当view需要更新时调用,一般预期ng-modle的使用者需要实现这个方法:
$setViewValue(value, trigger)
该函数用于更新view的value,当需要变更view values时,需要调用该方法。典型地,这个函数由DOM的事件处理函数来调用。比如,一个input directive在当它的input变更时就会调用$setViewValue,再比如:select控件在当一个option被选择时也会调用这个函数更新view value。
注意,当$setViewValue被调用时,新的value将会被staged,通过$parsers,$validators管道检查后被commit到view中。
$parsers
这是ngModelController提供的一个函数指针数组,它将作为一个pipeline,当控件从DOM读取value(由$viewVlaue缓存)时,这个$parsers数组中的所有函数将一个一个地执行。当顺序执行完毕后返回的value被传给$validators函数数组来做vaildation。如果parse发生错误,那么undefined将被返回。
$formatters
$formatters将包含一个作为pipeline的函数数组,在model value变更时被调用。这些函数将被反序调用,每个函数将其返回值传递给下一个函数。最后一个函数的输出作为实际的DOM value($viewValue)
该函数用于format/convert values for display in the control
function formatter(value) { if (value) { return value.toUpperCase(); }}ngModel.$formatters.push(formatter);
$validators
这是一个当model value变更时将会被调用的validator集合。
ngModel.$validators.validCharacters = function(modelValue, viewValue) { var value = modelValue || viewValue; return /[0-9]+/.test(value) && /[a-z]+/.test(value) && /[A-Z]+/.test(value) && /\W+/.test(value);};
综合示例:
app.directive('changeCase', function(){ return{ restrict: 'A', templateUrl: 'scripts/directives/directive_templates/directive.html', require: 'ngModel', link: function(scope, element, attr, ngModel){ ngModel.$formatters.push(function(value){ value.toUpperCase(); return value;}); ngModel.$parsers.push(function(value){ value.toUpperCase(); return value;}); } };});<form role="form" name="myform"> <div class="form-group"> <label>View Value:</label> <input name="someinput" changecase="" ng-model="some_letters.value"> </div></form><strong>ModelValue:</strong> <br>
阅读全文
0 0
- NgModelController: $setViewValue,$render,Formatter, Parser
- easyui datebox formatter parser
- Formatter
- Formatter
- Formatter
- formatter
- ngModelController详解
- Render;
- render
- angularjs中ngModelController学习
- angularjs中ngModelController学习
- AngularJS指令进阶 -- ngModelController详解
- abiword formatter
- Code Formatter
- flex formatter
- Formatter使用
- Formatter格式化
- Formatter(格式化)
- 夏季消暑养生吃什么?
- 判断一个节点是否在一棵二叉树中
- centos中从源程序升级python方法
- 《零基础入门学习Python》学习过程笔记【019函数返回值问题】
- #!/usr/bin/env python与#!/usr/bin/python的区别
- NgModelController: $setViewValue,$render,Formatter, Parser
- ROBOTICS2015 ORB-SLAM: a Versatile and Accurate Monocular SLAM System
- angular中的scope
- 通过cat /prco/driver/rtc 看到rtc的信息
- angular attrs.$observe和$scope.$watch的区别
- mobile webiste 中的css的font-size em及line-height等换算
- 【CUGBACM15级BC第11场 B】hdu 5055 Bob and math problem
- git internal for computer scientists
- 选择Code Style及Default Pro