如何解决循环中出现mat-datepicker问题
我正在学习angularjs,这是一个新手。我正尝试通过以下方式(经过大量在线搜索)使用ngFor在GUI上创建5个mat-datepicker组件
<div fxLayout="row" fxFlex=20 fxLayoutAlign="center center" fxLayoutGap="35px">
<mat-form-field fxFlex=20 appearance="outline" *ngFor="let pay of loanDetails.paymentOptions; index as i;">
<mat-label>Start Date</mat-label>
<input matInput [matDatepicker]="i" placeholder="Start date" [(ngModel)]="pay.paymentDate" (dateChange)="getLoanOutputData()">
<mat-datepicker-toggle matSuffix [for]="i"></mat-datepicker-toggle>
<mat-datepicker #i></mat-datepicker>
</mat-form-field>
</div>
但是,这似乎不起作用(意味着,当我单击日历图标时,日历没有打开),并且抛出了一些异常。
当单击日历图标时,出现以下错误:
这是我的loanDetails
在ts文件中的结构
loanDetails = {
principal: 100000,interestRate: 9.5,tenure: 5,startDate: new Date(),paymentOptions: [this.oneTimePay,this.yearlyPay,this.halfYearlyPay,this.quarterlyPay,this.monthlyPay]
};
oneTimePay = {
paymentType: "OneTime Payment",paymentDate: new Date(),paymentAmt: 0
}
所有其他“付款”,例如monthlyPay
等,都遵循与oneTimePay
相同的模式
请帮助我了解问题出在哪里。
解决方法
真的,您正在使用Angular(不是Angularjs)。好吧,在* ngFor中,您不必担心“模板引用变量”的名称,您应该使用相同的名称(不能使用“ i”,因为Angular有两个变量“ i”-循环变量和模板变量参考-
hostname: 127.0.0.1,port: 3306,user: 'root',password: "root",db: 'int'
(url: localhost:3306)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。