Angular2:如何绑定以选择多个

2024-01-10

我可以使用绑定ngModel对于单个选择,但我想将一个数组绑定到多个选定的选项。当我尝试这样做时,我收到错误

在“myModelProperty”中找不到不同的支持对象“xxx”

My Code

<select multiple [(ngModel)]="myModelProperty">
    <option *ngFor="#item of myOptions" [value]="item.value">{{item.name}}</option>
</select>

为什么对简单问题的所有这些复杂的答案。

如果您事先有必须选择的选项,您可以简单地这样做:

这段代码是good :

HTML

<select multiple [(ngModel)]="myModelProperty">
    <option *ngFor="#item of myOptions" [value]="item.value">{{item.name}}</option>
</select>

ANGULAR

myModelProperty: any;
myModelProperty = ['YOUR_VALUE', 'YOUR_VALUE'];

或者如果你有string,你可以解析它

myModelProperty: any;
myModelProperty = string.split(',');

所以,你所要做的就是[(ng模型)]从选择标签,必须在角度部分用一些对应于的值数组进行初始化[value]来自选项标签

这将根据数组中的值自动选择一个或多个选项。

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

Angular2:如何绑定以选择多个 的相关文章

随机推荐

  • 我怎样才能使这个模式持久化?

    我正在寻找一种方法 让这种模式在出现后持久存在 正如此处所示 用户只需在 div 外部单击一下即可将其关闭
  • 如何制作一个反应本机输入,向用户提供验证状态反馈。 [有效、Printine、错误、编辑]

    我希望输入能够随着用户键入而不断更新 然后失去焦点 反馈将是输入周围的边框 1 Green when valid 2 Amber when typing and is in error state Green when valid 3 Re
  • 一面一示例 T 测试 Python

    在 Python 中 我使用 SciPy 进行单样本 t 检验 from scipy import stats one sample data 177 3 182 7 169 6 176 3 180 3 179 4 178 5 177 2
  • Checkstyles + Gradle 抛出引起:java.lang.IllegalArgumentException:给定名称 COMPACT_CTOR_DEF

    我最近将 checkstyle 插件添加到项目中以进行静态代码分析 但更新之后google style xml从最新的大师那里 我开始收到以下异常 org gradle api tasks TaskExecutionException Ex
  • grails 2.0 - 正确使用 serverURL 进行生产?

    Grails 2 0 改变了它使用 grails serverURL 进行开发和测试环境的方式 如manual http grails org doc 2 0 x guide single html upgradingFromPreviou
  • Python从视频文件中提取wav

    Related 如何使用python从视频文件中提取音频 https stackoverflow com questions 19216450 how to extract audio from a video file using pyt
  • 如何在 Obj-C 类别中“伪造”ivars (iPhone)

    Update iPhone OS 3 1 有关联的对象 然而 iPhone 模拟器却没有 如果您想在模拟器中测试关联的对象代码 您应该提交错误 请参阅我的问题here https stackoverflow com questions 19
  • 最接近的 3 点组

    是否有一种已知的 有效的算法来查找最接近的组three云中的点 这类似于最近点对问题 http en wikipedia org wiki Closest pair of points problem但我正在寻找三点而不是两点 Edit 最
  • 导入路径 - 正确的方法?

    我知道有很多类似或相同的问题 但我仍然无法理解 找到使用模块的正确方法 Python 是我最喜欢的语言 除了使用导入之外 我喜欢其中的所有内容 递归导入 当您尝试引用尚不存在的名称时 导入路径等 所以 我有这样的项目结构 my projec
  • 类的 += 运算符的规范形式

    我知道尽可能多地使用非成员非友元类的接口是个好主意 而且我刚刚意识到 对于我的 3D 矢量类 Vector3 我可以移动 等运算符从类中删除 只留下构造函数和复制赋值运算符 问题是 这个运算符应该是什么样子 我见过许多其他运算符的规范形式并
  • 列表内部或外部的序言对有什么用

    我在 SWI PL 文档中多次遇到键值对 但无法获得有关它们的详细信息 这是序言中的标准内容还是只是 swi pl 的扩展 主要在这里找到 http www swi prolog org pldoc doc for object keyso
  • 调用带有返回值的存储过程

    我正在尝试从我的 C Windows 应用程序调用存储过程 该存储过程正在 SQL Server 2008 的本地实例上运行 我可以调用该存储过程 但无法从该存储过程检索值 该存储过程应该返回序列中的下一个数字 我在网上做了研究 我见过的所
  • 如何在 Swift 中将 CGRect 相互组合

    我想知道是否有任何方法可以将一个 CGRect 与另一个 CGRect 组合起来以获得一个新的 CGRect swift 是否有任何预设功能来执行此操作 或者是否有其他方法可以实现此目的 let rect1 CGRect x 0 y 0 w
  • 为什么这个交换函数调用不明确? [复制]

    这个问题在这里已经有答案了 我想使用模板交换两个数字 但为什么会这样 swap x y 给出一个错误作为不明确的调用 include
  • Python-3 和字符串编码中的 \x Vs \u Vs \U 以及原因

    为什么 Python 3 中有不同的面向字节的字符串表示形式 使用单一表示而不是多个表示还不够吗 对于打印字符串的 ASCII 范围编号 显示以以下开头的序列 x In 56 chr 128 Out 56 x80 在不同的数字范围内 Pyt
  • 阻止 EBS Linux 2 (Node.js) 尝试执行 npm install?

    我正在尝试在 Elastic Beanstalk 上的 AWS Linux 2 上运行节点应用程序 并且需要使用纱线安装依赖项 如果您尝试使用 npm 而不是纱线来安装依赖项 我的 Node 应用程序会导致错误 我已经想通了如何在 plat
  • 通过XPath获取tr中特定td的索引

    我的表中有 thead 和 tbody Thead 包含几个 s 每个都有一个 id 我需要通过 id 在 thead 中查找 td 的索引 然后在 tbody 中通过索引查找 table thead tr td td td td find
  • 如何决定spring kafka设置的并发数?

    我正在使用 KafkaListener 注释编写一个 kafka 消费者 我知道有一种方法可以使用 ConcurrentKafkaListenerContainerFactory 中的方法增加来自不同分区的并发 kafka 消费者的数量 e
  • 如何更改TWebBrowser中的字体?

    这个问题与 在 TWebBrowser 中加载字符串 HTML 代码 的最佳方法是什么 https stackoverflow com questions 39773033 which is the best way to load a s
  • Angular2:如何绑定以选择多个

    我可以使用绑定ngModel对于单个选择 但我想将一个数组绑定到多个选定的选项 当我尝试这样做时 我收到错误 在 myModelProperty 中找不到不同的支持对象 xxx My Code