在选择选项时选择角度 2 中的选项未显示正确值

超新星

我有一个表单,我正在为其动态创建添加按钮上的选择下拉列表。以下是我的 html 代码片段:

<div *ngFor="let event of tmpWeeklyEvent;let index=index" class="col-xs-12 padding-left-right-0 clearfix">
    <select title="Select Country" class="form-control margin-top-5" [disabled]="scheduleStatus==null || scheduleStatus==undefined" [(ngModel)]="event.enumvalue" name="eventStatus">
        <option *ngFor="let item of scheduleStatus" value="{{item.EnumId}}">{{item.EnumString}}
        </option>
    </select>
</div>
<button type="button" class="btn btn-primary" (click)="increaseWeeklyEvent()">Add New Event</button>

IncreaseWeeklyEvent() 只需将另一个事件添加到列表中:

increaseWeeklyEvent() {
    this.createWeekEvent();
}

createWeekEvent() {
        var newEvent = new TimeSchedule();
        var arrNewEvent = new Array<TimeSchedule>();

        if (this.scheduleStatus != null && this.scheduleStatus != undefined && this.scheduleStatus.length > 0)
        {
            newEvent.Time = "08:00";
            newEvent.enumvalue = this.scheduleStatus[0].EnumId;
            newEvent.Status = this.scheduleStatus[0].EnumString;

            this.tmpWeeklyEvent.push(newEvent);
        }
        else
        {
            this.toastr.error("No data found for Schedule Status Dropdown. Add/Edit will not work");
        }
    }

我的问题是,一旦我单击“添加”按钮,先前下拉列表中更改的值就会恢复为默认值。但是在模型上,更改的值被保留,即使在 HTML 上,我也可以看到正确的值绑定到了 select 标签。所以选择标签显示一些其他字符串,但根据下拉列表中的选择绑定到正确的值。

我尝试用 替换选项标签中的值[value][ngValue]但同样的问题仍然存在。

请建议我哪里出错了。

AJT82

我假设这是一种形式。对于表单,name属性需要是唯一的,以便字段被评估为单独的字段而不是一个和相同的字段。所以如果这是一个表单,你的表单值目前看起来像

{
  "eventStatus": 1,
}

不管你有多少个字段,它们都指向同一个字段。而正如您注意到的,您的数组具有正确的值。这只会影响表格。您可以通过给 select 一个 unique 来解决这个问题name,这可以使用索引来实现,因此将您的 select 更改为:

<div *ngFor="let event of tmpWeeklyEvent; let index=index">
  <select  [(ngModel)]="event.enumvalue" name="eventStatus{{index}}">
  <!-- ... -->

这应该可以解决您的问题。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

角度2选择选项默认值

来自分类Dev

应用Select2时,选择选项变为空白

来自分类Dev

2选择选项合并值并链接

来自分类Dev

选择选项时角度显示div,隐藏其他

来自分类Dev

Angular 2 选择选项状态

来自分类Dev

Angular 2,选择选项问题

来自分类Dev

角度-数组作为选择选项值

来自分类Dev

更改选择选项时获取当前值-Angular2

来自分类Dev

在删除另一个选择上的选择选项时重新填充select2选项

来自分类Dev

带有图像的角度选择选项

来自分类Dev

角度指令测试选择选项

来自分类Dev

如何以角度填充选择选项

来自分类Dev

选择选项时设置$ _GET值

来自分类Dev

在选择选项中显示值的问题

来自分类Dev

在html中显示选择选项的值

来自分类Dev

在html中显示选择选项的值

来自分类Dev

在html中显示选择选项的值

来自分类Dev

在html中显示选择选项的值

来自分类常见问题

选择选择选项时过滤div

来自分类Dev

如何在值输入文本上显示选择选项的值?(vue.js 2)

来自分类Dev

使用Jquery选择相应的选择选项时,是否可以更改选择选项的值?

来自分类Dev

角度js中的角度选择选项的条件?

来自分类Dev

未选择选项值时删除div

来自分类Dev

选择选项时,在选择下拉列表组中禁用选择选项

来自分类Dev

从数组分配时,角度选择选项显示为空白

来自分类Dev

选择选项选择到0值时,表单无效

来自分类Dev

选择选项时,jQuery禁用输入

来自分类Dev

Angular 2 ngModelChange选择选项,获取特定属性

来自分类Dev

Symfony2 / Twig-遍历选择选项