如何解决角度下拉值改变所有下拉值
我正在处理 angular 5 并面临用户可以添加多个数据的下拉列表问题。 我有一个表单,我在其中添加了几个文本框和一个下拉列表,然后我有一个添加更多按钮来复制该行,现在每行都有具有相同 ng-model 的下拉列表,因此在一个下拉列表中进行更改将反映所有其他内容的更改,我的选择代码在下面
<select [(ngModel)]="subSearch.salesPerson" class="form-control">
<option value="0">Please select</option>
<option *ngFor="let option of salesPersonList" [value]="option.UserId">{{option.FullName}}</option>
</select>
我如何管理一次只能更改一个下拉列表而其余部分不受影响,其余部分都是输入框并且它们按接受的方式工作
解决方法
你可以做一件事,不要在每个下拉菜单中都包含 ngmodel 并改变它:
dataTable.getFormattedValue(0,2);
每次drop都会改变的原因,它使用了用于双向数据绑定的NgModel。
,您需要将 ngModel
绑定源更改为数组(而不是 subSearch.salesPerson
)。尝试如下操作。
在您的 .ts
文件中声明一个数组来保存所选项目。
salesPeople = new Array<string>(4); // You will need to change this hard coded value.
在 ngModel
中,将其绑定到每个元素(而不是单个属性)
<select [(ngModel)]="salesPeople[i]" class="form-control">
这样每个 select
将绑定到单独的数组元素。最后,您可以从 salesPeople
数组中获取选定的销售人员列表。在下面查看我为演示目的制作的 StackBlitz 示例。
为了动态管理数组索引,您可以在每次添加一行时创建一个新数组(并将前一行复制到其中)。添加一个变量来跟踪您的行数,这应该是您数组的索引 - 或类似的东西。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。