1

我有一个从REST API. 用户应该能够操作数据。问题是当显示多行时(即data1 数组的长度大于1),所有#ds 输入元素中的日期都是相同的。所有#de 输入元素也是如此。我检查了名为data1的数组中的数据,并且没有重复的日期,所以问题出在html中。由于不使用的输入元素ngbDatepicker工作正常,问题与ngbDatePicker某种方式有关,但我不知道如何解决。

    <form class="form">
    <div class="row ml-5 mr-5 mb-2" *ngFor="let dataRow of data1; let in=index;">
        <div class="col-12 col-sm mb-2 mb-sm-0">
            <input class="form-control form-control-sm" #inpValue value="{{dataRow.fldValue}}" />
        </div>
        <div class="col-12 col-sm mb-2 mb-sm-0">
            <div class="input-group">
                <input class="form-control form-control-sm" placeholder="Start Date" name="ds"
                        [(ngModel)]="data1[in].inputStartDate" ngbDatepicker #ds="ngbDatepicker"/>
                <button class="input-group-addon" (click)="ds.toggle()" type="button">
                    <img src="assets/img/calendar_icon.gif" style="width: 1.2rem; height: 1rem; cursor: pointer;" />
                </button>
            </div>
        </div>
        <div class="col-12 col-sm mb-2 mb-sm-0">
            <div class="input-group">
                <input class="form-control form-control-sm" placeholder="End Date" name="de"
                        [(ngModel)]="data1[in].inputEndDate" ngbDatepicker #de="ngbDatepicker" />
                <button class="input-group-addon" (click)="de.toggle()" type="button">
                    <img src="assets/img/calendar_icon.gif" style="width: 1.2rem; height: 1rem; cursor: pointer;" />
                </button>
            </div>
        </div>
        <div class="col-12 col-sm mb-2 mb-sm-0">
            <button class="btn btn-primary btn-block w-100" (click)="saveBtn(dataRow, inpValue.value, dataRow.fldRowID)">Save</button>
        </div>
    </div>
</form>

此图说明了问题: 显示相同的日期,即使最上面的数据行包含开始日期 1900-01-01 和结束日期 2018-02-11

4

0 回答 0