需求背景:

在form中使用编写的某component directive时。想通过form's name来对form中控件进行操作,
如使用$invalid等来ng-disabled btn。

解决方式:

通过使用form.$addControl将控件中的control注冊到form中,既可使用form's name.xxx.$invalid方式来操作。

详细方法:

    tw.directive('nameForForm', function() {
return {
restrict: 'A',
require: "?ngModel",
link: function($scope, elem, attrs, ngModelCtrl) { var formController = elem.controller('form') || {
$addControl: angular.noop
}; ngModelCtrl.$name = attrs.workflowNameForForm;
formController.$addControl(ngModelCtrl); $scope.$on('$destroy', function() {
formController.$removeControl(ngModelCtrl);
}); return true;
}
};
});

使用方式:

component:

<div class="btn-group select select-block mbn">
...
<input type="text" ng-show="false" ng-model="selectedValue" ng-required="selectRequired"
name-for-form="{{nameForForm}}" />
</div>

注意:在component中引入nameForForm,且scope中加入nameForForm: '@'


页面使用component:

<tw-select-list name-for-form="city" ... />

參考:http://www.ngnice.com/posts/81c1eb92bfbde0

AngularJS form $addControl 注冊控件control的更多相关文章

  1. Leaflet:控件Control相关

    Leaflet官方文档中只给出了4种控件:Zoom.Attribution.Layers.Scale:它们都是继承自Control类,具体可以参考Control. Control Zoom.Scale ...

  2. 线程间操作无效: 从不是创建控件“”的线程访问它~~~的解决方法~ 线程间操作无效: 从不是创建控件“Control Name'”的线程访问它问题的解决方案及原理分析

    看两个例子,一个是在一个进程里设置另外一个进程中控件的属性.另外一个是在一个进程里获取另外一个进程中控件的属性. 第一个例子 最近,在做一个使用线程控制下载文件的小程序(使用进度条控件显示下载进度)时 ...

  3. [转]通过AngularJS directive对bootstrap日期控件的的简单包装

    本文转自:http://www.cnblogs.com/Benoly/p/4109460.html 最近项目上了AngularJS,而原来使用的日期控件的使用方式也需要改变,于是开始了倒腾,看了官方的 ...

  4. [整理]通过AngularJS directive对bootstrap日期控件的的简单包装

    最近项目上了AngularJS,而原来使用的日期控件的使用方式也需要改变,于是开始了倒腾,看了官方的例子,可以使用AngularJS的directive做简单的处理,这样在html里直接使用申明的的形 ...

  5. 【经验】Angularjs 中使用 layDate 日期控件

    layDate 控件地址:http://laydate.layui.com/ 前情:原来系统中使用的日期控件是UI bootstrap(地址:https://angular-ui.github.io/ ...

  6. C# WinForm窗体 控件Control 的 Invalidate、Update、Refresh的区别

    Control.Refresh - does an Control.Invalidate followed by Control.Update.Refresh: 强制控件使其工作区无效并立即重绘自己和 ...

  7. AngularJs的UI组件ui-Bootstrap---tabs控件

    tabs控件使用uib-tabset指令和uib-tab指令,效果是这样的: <!DOCTYPE html> <html ng-app="ui.bootstrap.demo ...

  8. .net控件Control透明

    public partial class tspControl : UserControl { public tspControl() { InitializeComponent(); SetStyl ...

  9. AngularJS页面【uib-dropdown】控件在模态窗口(弹出窗)中无法使用问题

    如果你的下拉框中有属性 dropdown-append-to-body 将它去掉,即可正常使用该插件. <div class="btn-group dropdown" uib ...

随机推荐

  1. Android Handler 消息循环机制

    前言 一问起Android应用程序的入口,很多人会说是Activity中的onCreate方法,也有人说是ActivityThread中的静态main方法.因为Java虚拟机在运行的时候会自动加载指定 ...

  2. Http协议三次握手过程

    Http协议三次握手过程   TCP(Transmission Control Protocol) 传输控制协议 TCP是主机对主机层的传输控制协议,提供可靠的连接服务,采用三次握手确认建立一个连接: ...

  3. EffectiveJava(17)要么为继承而设计,要么禁止继承

    1.如果为了继承而设计类,那么该类必须有文档说明它可覆盖的方法的自用性.对于每个公有的 或受保护的方法或者构造器,它的文档必须指明该方法或者构造器调用了那些可覆盖的方法,是以 什么顺序调用的,每个调用 ...

  4. 【Javascript 基础】使用数组

    Javascript 数组的工作方式与大多数编程语言的数组类似. <!DOCTYPE html> <html lang="en"> <head> ...

  5. IO流(一)File类

    1.File类:表示文件和目录路径的抽象的表示形式,可以实现文件的创建,删除,重命名等,是唯一与文件本 有关的操作类. 2.File类的API定义:public class File extends ...

  6. GMGC记实(上篇)

    24日和25日參加了2014年GMGC大会,整体感觉今年的大会比前2届大会办的更符合听众的需求.由于今年的大会开设了开发人员训练营的分会场.在成都这样一个CP占主流的IT圈中非常有意义.另一点就是在会 ...

  7. Hbase笔记:批量导入

    工作中可能会有对HBase的复杂操作,我们现在对HBase的操作太简单了.复杂操作一般用HBaseScan操作,还有用框架对HBase进行复杂操作,iparler,sharker.我们说HBase是数 ...

  8. HDU4647:Another Graph Game(贪心)

    Problem Description Alice and Bob are playing a game on an undirected graph with n (n is even) nodes ...

  9. 北大BBS2008年毕业生晒工资

    http://www.amznz.com/19/快消类: 宝洁:本7200.研8200.博9700,均14个月,另有800交通补助,marketing每9个月 涨20%-30%. 玛氏:月薪10000 ...

  10. SQL优化的一些总结 SQL编写一般要求

    SQL编写一般要求---SQL语句尽可能简单---分解联接保证高并发---同数据类型的列值比较---不在索引列做运算---禁止使用SELECT *---避免负向查询和%前缀模糊查询---保持事务(连接 ...