如何在嵌套的 ngFor 循环中从 ion-select 中获取值?
How to get value out of a ion-select in a nested ngFor loop?
如标题所述。我的 html 中有一个嵌套的 ngFor
循环。我在 ion-select
语句中使用这些 ngFor
循环之一。这是我的代码:
<ion-item *ngFor="let item of pageOptions" >
<ion-label>{{item.attender.FIRST_NAME}} {{item.attender.LAST_NAME}}</ion-label>
<ion-select multiple="true">
<ion-option value="item" *ngFor="let item of item.options">{{item.ATTENDER_NAME}} ${{item.PARTICIPANT_PRICE}}</ion-option>
</ion-select>
</ion-item>
我正在尝试弄清楚如何使用 [(ngModel)]
从 *ngFor="let item of item.options"
中获取值。
谁能帮我解决这个难题?
我被要求提供我的数据。我有一个数组,我正在将这个 object 推入: let item = { attender: member, options: [{}] };
选项部分将 JSON object 推入其中。这甚至可能是不可能的。
这里是数据的总构建:
this.attenders = this.clickedItem.attenders;
this.attenderOptions = this.clickedItem.activityDefinition.ATTENDERS; //this might not be ATTENDERS
this.positionOptions = this.clickedItem.activityDefinition.POSITIONS;
this.guests = this.clickedItem.guests;
for (var i = 0; i < this.attenders.length; i++) {
let item = {
attender: this.attenders[i],
options: []
};
for (var j = 0; j < this.attenderOptions.length; j++) {
let minAge = this.attenderOptions[j].MIN_PARTICIPANT_AGE;
let maxAge = this.attenderOptions[j].MAX_PARTICIPANT_AGE;
let minGrade = this.attenderOptions[j].MIN_PARTICIPANT_GRADE;
let maxGrade = this.attenderOptions[j].MAX_PARTICIPANT_GRADE;
let availablePositions = this.attenderOptions[j].AVAILABLE_POSITIONS;
var birthdate = this.convertBirth(this.attenders[i].BIRTH_DAY, this.attenders[i].BIRTH_MONTH, this.attenders[i].BIRTH_YEAR)
var gradeString = this.attenders[i].GRADE;
var grade = this.convertGrade(gradeString);
if (availablePositions > 0) {
if ((this.compareMinDates(birthdate, minAge) && this.compareMaxDates(birthdate, maxAge)) || (this.compareMinGrades(grade, minGrade) && this.compareMaxGrades(grade, maxGrade))) {
//within age constraints
item.options.push(this.attenderOptions[j]);
} else if (minAge == "" && maxAge == "" && minGrade == "" && maxGrade == "") {
item.options.push(this.attenderOptions[j]);
}
}
}
for (var j = 0; j < this.positionOptions.length; j++) {
if (this.positionOptions[i] != undefined) {
let minAge = this.positionOptions[j].MIN_PARTICIPANT_AGE;
let maxAge = this.positionOptions[j].MAX_PARTICIPANT_AGE;
let minGrade = this.positionOptions[j].MIN_PARTICIPANT_GRADE;
let maxGrade = this.positionOptions[j].MAX_PARTICIPANT_GRADE;
let availablePositions = this.positionOptions[j].POSITIONS_REMAINING;
var birthdate = this.convertBirth(this.attenders[i].BIRTH_DAY, this.attenders[i].BIRTH_MONTH, this.attenders[i].BIRTH_YEAR)
var gradeString = this.attenders[i].GRADE;
var grade = this.convertGrade(gradeString);
if (availablePositions >= 0) {
if ((this.compareMinDates(birthdate, minAge) && this.compareMaxDates(birthdate, maxAge)) || (this.compareMinGrades(grade, minGrade) && this.compareMaxGrades(grade, maxGrade))) {
//within age constraints
this.positionOptions[i].ATTENDER_NAME = this.positionOptions[i].POSITION_NAME;
this.positionOptions[i].PARTICIPANT_PRICE = 0;
item.options.push(this.positionOptions[j]);
} else if (minAge == "" && maxAge == "" && minGrade == "" && maxGrade == "") {
this.positionOptions[i].ATTENDER_NAME = this.positionOptions[i].POSITION_NAME;
this.positionOptions[i].PARTICIPANT_PRICE = 0;
item.options.push(this.positionOptions[j]);
}
}
}
}
this.pageOptions.push(item);
}
我认为这应该可行
<ion-item *ngFor="let item of pageOptions" >
<ion-label>{{item.attender.FIRST_NAME}} {{item.attender.LAST_NAME}}</ion-label>
<ion-select [(ngModel)]="select" multiple="true">
<ion-option value="item" *ngFor="let item of item.options">{{item.ATTENDER_NAME}} ${{item.PARTICIPANT_PRICE}}</ion-option>
</ion-select>
如标题所述。我的 html 中有一个嵌套的 ngFor
循环。我在 ion-select
语句中使用这些 ngFor
循环之一。这是我的代码:
<ion-item *ngFor="let item of pageOptions" >
<ion-label>{{item.attender.FIRST_NAME}} {{item.attender.LAST_NAME}}</ion-label>
<ion-select multiple="true">
<ion-option value="item" *ngFor="let item of item.options">{{item.ATTENDER_NAME}} ${{item.PARTICIPANT_PRICE}}</ion-option>
</ion-select>
</ion-item>
我正在尝试弄清楚如何使用 [(ngModel)]
从 *ngFor="let item of item.options"
中获取值。
谁能帮我解决这个难题?
我被要求提供我的数据。我有一个数组,我正在将这个 object 推入: let item = { attender: member, options: [{}] };
选项部分将 JSON object 推入其中。这甚至可能是不可能的。
这里是数据的总构建:
this.attenders = this.clickedItem.attenders;
this.attenderOptions = this.clickedItem.activityDefinition.ATTENDERS; //this might not be ATTENDERS
this.positionOptions = this.clickedItem.activityDefinition.POSITIONS;
this.guests = this.clickedItem.guests;
for (var i = 0; i < this.attenders.length; i++) {
let item = {
attender: this.attenders[i],
options: []
};
for (var j = 0; j < this.attenderOptions.length; j++) {
let minAge = this.attenderOptions[j].MIN_PARTICIPANT_AGE;
let maxAge = this.attenderOptions[j].MAX_PARTICIPANT_AGE;
let minGrade = this.attenderOptions[j].MIN_PARTICIPANT_GRADE;
let maxGrade = this.attenderOptions[j].MAX_PARTICIPANT_GRADE;
let availablePositions = this.attenderOptions[j].AVAILABLE_POSITIONS;
var birthdate = this.convertBirth(this.attenders[i].BIRTH_DAY, this.attenders[i].BIRTH_MONTH, this.attenders[i].BIRTH_YEAR)
var gradeString = this.attenders[i].GRADE;
var grade = this.convertGrade(gradeString);
if (availablePositions > 0) {
if ((this.compareMinDates(birthdate, minAge) && this.compareMaxDates(birthdate, maxAge)) || (this.compareMinGrades(grade, minGrade) && this.compareMaxGrades(grade, maxGrade))) {
//within age constraints
item.options.push(this.attenderOptions[j]);
} else if (minAge == "" && maxAge == "" && minGrade == "" && maxGrade == "") {
item.options.push(this.attenderOptions[j]);
}
}
}
for (var j = 0; j < this.positionOptions.length; j++) {
if (this.positionOptions[i] != undefined) {
let minAge = this.positionOptions[j].MIN_PARTICIPANT_AGE;
let maxAge = this.positionOptions[j].MAX_PARTICIPANT_AGE;
let minGrade = this.positionOptions[j].MIN_PARTICIPANT_GRADE;
let maxGrade = this.positionOptions[j].MAX_PARTICIPANT_GRADE;
let availablePositions = this.positionOptions[j].POSITIONS_REMAINING;
var birthdate = this.convertBirth(this.attenders[i].BIRTH_DAY, this.attenders[i].BIRTH_MONTH, this.attenders[i].BIRTH_YEAR)
var gradeString = this.attenders[i].GRADE;
var grade = this.convertGrade(gradeString);
if (availablePositions >= 0) {
if ((this.compareMinDates(birthdate, minAge) && this.compareMaxDates(birthdate, maxAge)) || (this.compareMinGrades(grade, minGrade) && this.compareMaxGrades(grade, maxGrade))) {
//within age constraints
this.positionOptions[i].ATTENDER_NAME = this.positionOptions[i].POSITION_NAME;
this.positionOptions[i].PARTICIPANT_PRICE = 0;
item.options.push(this.positionOptions[j]);
} else if (minAge == "" && maxAge == "" && minGrade == "" && maxGrade == "") {
this.positionOptions[i].ATTENDER_NAME = this.positionOptions[i].POSITION_NAME;
this.positionOptions[i].PARTICIPANT_PRICE = 0;
item.options.push(this.positionOptions[j]);
}
}
}
}
this.pageOptions.push(item);
}
我认为这应该可行
<ion-item *ngFor="let item of pageOptions" >
<ion-label>{{item.attender.FIRST_NAME}} {{item.attender.LAST_NAME}}</ion-label>
<ion-select [(ngModel)]="select" multiple="true">
<ion-option value="item" *ngFor="let item of item.options">{{item.ATTENDER_NAME}} ${{item.PARTICIPANT_PRICE}}</ion-option>
</ion-select>