需求背景:

在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. GoodSync

    文件管理这件看 似简单的事,真的不简单,因为为了防止意外情况,你需要对文件进行备份,时间一久随着文件数量的增加,再加上有时也会临时队备份文件进行修改等.再想查出 这个是最新的.文件有木有全部备份等…. ...

  2. Android AIDL实例解析

    AIDL这项技术在我们的开发中一般来说并不是很常用,虽然自己也使用新浪微博的SSO登录,其原理就是使用AIDL,但是自己一直没有动手完整的写过AIDL的例子,所以就有了这篇简单的文章. AIDL(An ...

  3. (转载)EF 使用code first模式创建数据库和 填充种子数据

    第一篇:来自 .net 开发菜鸟 博主的文章:https://www.cnblogs.com/dotnet261010/p/8035213.html 第二篇:来自 JustYong 博主的文章:htt ...

  4. SpringBoot 框架整合webservice

    spring boot集成web service框架 题记: 本篇博客讲的spring boot如何集成 spring web service,如果您想用Apache CXF集成,那么可能不适合您.为 ...

  5. scala,import test._ ; import test.{ClassA,ClassB}

    在scala中,*不是通配符,下斜杠“_”才是通配符.因此当使用某个package所有的类时,直接使用:import test._:使用某几个时,直接使用:import test.{ClassA,Cl ...

  6. django静态html中做动态变化

    在搭建网站中经常有筛选分类的需求 在django中为了简便,我们经常将某些相同部分的内容取出来单独存放形成一个base模板,其他的template继承这个base就可以使用其中的内容 但是这些相同的部 ...

  7. 解决svn锁定

    问题:今天去公司 svn-update的时候,报错svn:E155004,提示说什么locked 解决:svn cleanup解除锁定,然后就可以操作了. 原因:SVN 本地更新时,由于一些操作中断更 ...

  8. idea 添加多模块项目

    建立多模块工程先建立一个空的项目,File-Project-Maven不勾选create from archetype即可 然后再右键父工程 添加模块jar包 添加模块war包 然后再pom中配置引用 ...

  9. 初步了解更新锁(U)与排它锁(X)

     一直没有认真了解UPDATE操作的锁.近期在MSDN论坛上看到一个问题,询问堆表更新的死锁问题,问题非常easy,有相似这种表及数据: CREATE TABLE dbo.tb( c1 int, ...

  10. 单片机小白学步系列(十三) 点亮第一个LED——好的開始,成功的一半

    前面介绍了非常多概念知识.做了非常多准备工作,从这一节開始,我们正式開始单片机的学习.我们将使用单片机完毕一项非常easy的工作:点亮一个发光二极管(即LED:Light-Emitting Diode ...