我有日期输入字段，如果我单击添加，它会在上一个字段下方提供相同的字段。现在，我以这种方式编写了HTML，因此它给出了错误，TypeError: Cannot read property '0' of undefined并且页面无法仅打开。.任何人都可以帮助我解决这个问题。
HTML：
<md-card *ngFor="let positionDetails of positions; let i = index">
<div>
<md-input-container>
<input mdInput type="text" name="positionDetails.position_start[i]" [ngModel]="positionDetails.position_start [i]| date:'dd/MM/yyyy'" (ngModelChange)="positionDetails.position_start[i] = $event" (focus)="openPosition()[i]" [readonly]="true">
</md-input-container>
<div *ngIf="showPosition">
<datepicker [(ngModel)]="positionstart" name="positionDetails.ddv[i]" [showWeeks]="false" [maxDate]="positionend" (selectionDone)="onPositionStart($event)"></datepicker>
</div>
</div>
</md-card>
Ts：
this.positions = [{
"position_start":"",
}];
openPosition(i){
this.showPosition = true;
}
onPositionStart(event:any,i) {
console.log(event);
this.positionstart = event;
console.log(this.positionstart);
this.positionDetails.position_start = new Date(this.positionstart);
console.log(this.positionDetails.position_start);
this.showPosition = false;
}
您应该positionDetails在ngFor中使用范围。这将确保ngFor的每次迭代都相互独立。
<md-card *ngFor="let positionDetails of positions">
<div>
<md-input-container>
<input mdInput type="text" [ngModel]="positionDetails.position_start | date:'dd/MM/yyyy'" (focus)="openPosition(positionDetails)" [readonly]="true">
</md-input-container>
<div *ngIf="positionDetails.showPosition">
<datepicker [(ngModel)]="positionDetails.position_start" [showWeeks]="false" [maxDate]="positionend" (selectionDone)="onPositionStart($event, positionDetails)"></datepicker>
</div>
</div>
</md-card>
这意味着您必须更新方法才能仅修改给定的 positionDetails
openPosition(positionDetails){
positionDetails.showPosition = true;
}
onPositionStart(event: any, positionDetails) {
positionDetails.position_start = new Date(event);
positionDetails.showPosition = false;
}
并给每个迭代它自己的变量集
this.positions = [{
"position_start": "",
"showPosition": false
}];
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句