如何从 html 传递属性值

Question

<ion-select [(ngModel)]="selection" (ionChange)="optionsFn(itinerary.dateRange)">
    <ion-select-option *ngFor="let itinerary of itineraries">{{itinerary.startDate | date: "MM/dd"}} - {{itinerary.endDate | date: "MM/dd"}}</ion-select-option>
</ion-select>

在此代码中，dateRange 在 html 中不可见，但它是行程的一部分。如何将 dateRange 属性从 HTML 传递给函数？

我收到以下控制台错误：

TypeError: Cannot read property 'dateRange' of undefined

Answer 1

使用 value 属性映射到 selection。

<ion-select [(ngModel)]="selection" (ionChange)="optionsFn(selection.dateRange)">
    <ion-select-option [value]="itinerary" *ngFor="let itinerary of itineraries">{{itinerary.startDate | date: "MM/dd"}} - {{itinerary.endDate | date: "MM/dd"}}</ion-select-option>
</ion-select>

Answer 2

你的 ionChange() 不应该有 itinerary 因为它只存在于 ion-select-option.

的范围内

您可以改用 $event 并将 <ion-select-option> 的值绑定到 itinerary 对象。

类似于：

<ion-select [(ngModel)]="selection" (ionChange)='optionsFn($event)'>
  <ion-select-option *ngFor="let itinerary of itineraries" [value]="itinerary">{{itinerary.startDate | date: "MM/dd"}} - {{itinerary.endDate | date: "MM/dd"}}</ion-select-option>
</ion-select>

（我不了解 ionic 的全部内容，但出于某种原因，当您在 [value] 中传递对象时它不会抱怨，它似乎没有完全使用 [ngValue]。）

从那里开始，如果您 console.log 您在 optionsFn(e) 中的事件，您应该会看到日期范围为属性的对象。

希望对您有所帮助:)

如何从 html 传递属性值

How do I pass property values from html

html

firebase

angular

ionic4

如何从 html 传递 属性 值

How do I pass property values from html

html

firebase

angular

ionic4

如何从 html 传递属性值