Angular2 中 FormControlName 的动态绑定

2024-06-23

我正在创建嵌套组件。有多个 formGroups 我想动态绑定它们。例如。

组件中的 forGroup 就像

formGroup : {
    controls:{
        firstName: FormControl,
        lastName: FormControl,
        userName: FormControl,
        Password: FormControl
    }
}

HTML 类似于 & 它用于多个控件..

<div [formGroup]='formGroup'>
    <div class="error-box">{{formGroup.controls.get('firstName').errors}}</div>

    <div *ngIf="formControl.firstName?.visible" [ngClass]="{'has-error': formControl.firstName.error}">
        <label>{{formGroup.controls.get('firstName').label}}</label>
        <input type="text" formControlName="firstName" [maxlength]="formContrl.firstName?.maxLength">
        <span class="error" *ngif="formControl.firstName.error"></span>
    </div>

    <div class="error-box">{{formGroup.controls.get('lastName').errors}}</div>

    <div *ngIf="formControl.lastName?.visible" [ngClass]="{'has-error': formControl.lastName.error}">
        <label>{{formGroup.controls.get('lastName').label}}</label>
        <input type="text" formControlName="lastName" [maxlength]="formContrl.lastName?.maxLength">
        <span class="error" *ngif="formControl.lastName.error"></span>
    </div>
</div>

我想将控件绑定在公共组件中。

我试过这个。

<text-input [group]="formGroup.controls.firstName" [formControls]="formControl.firstName"></text-input>

所以我正在创建常见的 HTML,但是当我尝试绑定它时,它在绑定指令时给了我错误formControlName="formControls.name //withwhat I am passing"


刚刚遇到同样的问题...

你必须使用[formControlName]="formControls.name"代替formControlName="formControls.name".

更多信息请点击此处https://angular.io/docs/ts/latest/cookbook/dynamic-form.html https://angular.io/docs/ts/latest/cookbook/dynamic-form.html.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular2 中 FormControlName 的动态绑定 的相关文章

随机推荐

  • 如何从 iPhone 中的 NSString 中删除 HTML 标签?

    我正在使用日历功能来满足我的应用程序要求 如果我单击今天日期或明天日期或其他某个日期 则需要在其中显示吉祥详细信息UITextview 我一直在尝试在文本视图中格式化字符串 但无法解决 我对 xcode 很陌生 我想删除HTML我的字符串中
  • Google Script:如何突出显示一组单词?

    我想为谷歌文档编写一个脚本来自动突出显示一组单词 一句话 我可以使用这样的脚本 function myFunction var doc DocumentApp openById ID var textToHighlight TEST var
  • 从 URL 导入数据

    圣路易斯联邦储备银行的各种网页上提供了大量数据 例如 http research stlouisfed org fred2 series OILPRICE downloaddata cid 32217 http research stlou
  • 在 Python 中查找某个日期之前的时间

    找到约会前的时间的最佳方法是什么 我想知道年 月 日和小时 我希望有人有一个很好的功能 我想做这样的事情 此评论是在 2 个月零三天前发布的 或者此评论是在 1 年零 5 个月前发布的 datetime http docs python o
  • Git 命令以编程方式将文件的一系列行添加到索引?

    我想要一个命令可以让我做类似的事情 git manual add some file txt 10 20 这相当于 git add p some file txt 并说y仅包含第 10 行到第 20 行的大块 是否有内部 git 命令可以让
  • 无法在 Appium 中使用 xpath 定位元素

    我无法使用 xpath 识别元素 附上相同的屏幕截图 我想用标签标识元素列表
  • AngularJS ngRepeat:如何区分偶数/奇数元素?

    我是角度新手 并尝试执行以下操作 tr div td class even a href element a td div div td class odd a href element a td div tr 对于上面的代码 两者ng i
  • 尝试使用 openpyxl.load_workbook 访问文件时出现“TypeError:值必须是序列”

    我正在使用代码访问网络服务器上的 Excel 文件 import openpyxl path r S dic1 dic2 dic3 file xlsx wb openpyxl load workbook path 这在我的电脑上工作得很好
  • jquery-select2 的依赖下拉内容

    我有一个 Rails 4 应用程序 我在其中使用 Jquery select2 作为下拉列表 我有两个下拉菜单 我希望第一个下拉菜单中的选择确实决定了用户可以在第二个下拉菜单中选择的内容 有点像选择一个国家并给出该国家的州列表 在我的应用程
  • 如何在AppDelegate中执行Segue?

    我正在尝试使用 Storyboard 在 IOS 5 1 上完成一个应用程序 基本上我正在做一个保管箱应用程序 由于我使用的是 Dropbox SDK Dropbox 的链接是在 AppDelegate m 中处理的 用户可以选择从会话中取
  • StockTrader RI > 控制器、演示者,WTF?

    我目前正在学习如何通过 Prism 复合 WPF 项目高级使用 WPF 我观看了很多视频和示例 演示应用程序 StockTraderRI 让我提出了这个问题 以下各部分的具体作用是什么 SomethingService 好的 这是管理数据的
  • 避免 Memcache 对值的“长度为 1000000 字节”限制

    我的模型有不同的实体 我想像公司的员工一样计算一次 为了避免一次又一次地进行相同的查询 计算出的列表被保存在 Memcache 中 持续时间 1天 问题是应用程序有时会给我一个错误 指出 Memcache 中存储的字节数超过了允许的字节数
  • 无法让“rails new”工作

    我是一个渴望接触 Ruby on Rails OSX 10 7 的新手 但首先我需要安装它 现在我花了 9 个小时试图让它工作 但当我尝试创建一个新项目时它总是失败 rails new Users tom Documents 14 Utve
  • 创建一个包含另一个 git 存储库的 git 存储库

    我创建了一个裸 git 存储库 我们称之为存储库 1 并克隆了它 在克隆 repo 2 中 我创建了几个文件夹 其中我决定创建一个 git repo repo 3 当我提交到 repo 2 时 一切都按预期运行 除了 repo 3 被忽略
  • 如果工作簿和工作表未处于活动状态,则无法使用范围[重复]

    这个问题在这里已经有答案了 当我尝试将值从一个工作簿导入到另一个工作簿时 出现应用程序或对象定义的错误 我已经能够通过显式激活工作簿并在引用每个工作表的范围之前选择工作表来解决此问题 但如果可能的话 我想避免这种情况 此时 两个工作簿都在代
  • 如何在活动之外获取屏幕指标?

    我在这里制作了一个通用池 public class FruitPool extends GenericPool
  • 左侧赋值无效,javascript

    我确信我在这里做了一些愚蠢的事情 var addhtml div class left float div e screen name div div img src e div div e description div div inva
  • 如何在 asp:textbox 中添加提示

    如何在 asp TextBox 中放置提示 占位符 当我说提示时 我指的是一些当用户单击它时消失的文本 有没有办法使用 html css 实现相同的目的 The placeholder属性 您正在寻找placeholder https de
  • 未解决的依赖关系 - 导入 SBT 项目时出错

    导入SBT项目时出错 warn warn UNRESOLVED DEPENDENCIES warn warn org apache hadoop hadoop mapreduce client app 2 6 0 cdh5 4 2 not
  • Angular2 中 FormControlName 的动态绑定

    我正在创建嵌套组件 有多个 formGroups 我想动态绑定它们 例如 组件中的 forGroup 就像 formGroup controls firstName FormControl lastName FormControl user