需求背景:

在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. ora01940 无法删除当前连接的用户

    我用system这个用户登录oracle,想删除掉一个自己创建的用户user,在网上找到的方法都是说先查找到该用户连接的会话select username,sid,serial# from v$ses ...

  2. http://www.cnblogs.com/dolphin0520/p/3949310.html

    http://www.cnblogs.com/dolphin0520/p/3949310.html

  3. solr 常用命令

    1.启动和关闭 a.启动和重启 启动和重启命令有很多选项让你运行在SolrCloud模式,使用示例配置,以hostname为开头或者非默认端口,指向本地ZooKeeper. bin/solr star ...

  4. 【Hive】Hive 基础

    Hive架构: Hive基础 1 概念 1.1 简介 1.1.1 hive是基于Hadoop的一个数据仓库工具,可以将结构化的数据文件映射为一张数据库表, 并提供简单的sql查询功能,可以将sql语句 ...

  5. 【LeetCode-面试算法经典-Java实现】【109-Convert Sorted List to Binary Search Tree(排序链表转换成二叉排序树)】

    [109-Convert Sorted List to Binary Search Tree(排序链表转换成二叉排序树)] [LeetCode-面试算法经典-Java实现][全部题目文件夹索引] 原题 ...

  6. 数据结构与算法——优先队列类的C++实现(二叉堆)

    优先队列简单介绍: 操作系统表明上看着是支持多个应用程序同一时候执行.其实是每一个时刻仅仅能有一个进程执行,操作系统会调度不同的进程去执行. 每一个进程都仅仅能执行一个固定的时间,当超过了该时间.操作 ...

  7. 不在JPA 的 persistence.xml 文件里配置Entity class的解决的方法

     在Spring 集成 Hibernate 的JPA方式中,须要在persistence配置文件里定义每个实体类.这样很地不方便.2种方法能够解决此问题: 这2种方式都能够实现不用在persist ...

  8. 倍福TwinCAT(贝福Beckhoff)基础教程 松下绝对值驱动器如何做初始化设置

    安装调试软件PANATERM 6.0,完成之后可以自动检测到连接的设备(如果软件是之前的版本,则可能无法准确识别A5B系列)   点击试运行,伺服关闭,然后会发现伺服开启按钮可用了   测试正反转没有 ...

  9. MPTCP 源码分析(一) MPTCP的三次握手

    简述:      MPTCP依然按照正常的TCP进行三次握手,只是在握手过程中增加了MPTCP特有的信息.   建立过程      三次握手过程如下图所示: 左边客户端发送的第一个SYN包携带有客户端 ...

  10. hdu - 4974 - A simple water problem(贪心 + 反证)

    题意:N个队(N <= 100000),每一个队有个总分ai(ai <= 1000000),每场比赛比赛两方最多各可获得1分,问最少经过了多少场比赛. 题目链接:http://acm.hd ...