我想知道,如何根据下拉菜单的选定值绑定变量。 现在,我已经知道了:
"styles": [
"src/styles.css",
"node_modules/dragula/dist/dragula.min.css",
"node_modules/fullcalendar/dist/fullcalendar.min.css",
"node_modules/fullcalendar-scheduler/dist/scheduler.min.css"
],
"scripts": [
"node_modules/moment/moment.js",
"node_modules/dragula/dist/dragula.min.js",
"node_modules/fullcalendar/dist/fullcalendar.min.js",
"node_modules/fullcalendar/dist/dragula.min.js"
"node_modules/fullcalendar-scheduler/dist/scheduler.min.js"
]
this.moleCaracteristique.pourcentDavoirCaracteristique始终为70。
JSON
this.moleCaracteristique.pourcentDavoirCaracteristique = this.mole.moleCaracteristiques[0].pourcentDavoirCaracteristique;
HTML
{
"id": 1,
"email": "test@gmail.com",
"password": "passw",
"nom": "titi",
"moles": [
{
"id": 1,
"commentaire": "bras droit",
"nomFichier": "fichier",
"moleCaracteristiques": [
{
"id": 2,
"percentToHaveTheCaracteristic": 92,
"caracteristique": {
"id": 2,
"libelle": "milka"
}
},
{
"id": 1,
"percentToHaveTheCaracteristic": 70, //This is where the 70 comes from**
"caracteristique": {
"id": 1,
"libelle": "globule"
}
}
]
}
]
}
TS
<div class="col-xs-12 marginBottom10" >
<b>Choisissez une caracteristique :</b>
<select class='select-option' required [(ngModel)]='optionSelected' (ngModelChange)='onOptionsSelected($event)'>
<option class='option' *ngFor='let option of options' [value]="option">{{option.libelle}}</option>
</select>
</div>
<div class="text-center">
<button (click)="complete()"> Soumettre</button>
</div>
<div *ngIf = "optionSelected">
{{ this.moleCaracteristique.percentToHaveTheCaracteristic}}%
</div>
当我选择“ globule”时,它必须为70,但是当我选择“ milka”时,它应为92 ... 我该如何实现?
非常感谢!
编辑
这是我从中获取的JSON
ngOnInit() {
this.getCaracteristiques();
}
onOptionSelected(event) {
console.log(event); // option value will be sent as event
}
openModal() {
this.moleCaracteristique = new Object();
this.moleCaracteristique.percentToHaveTheCaracteristic = this.mole.moleCaracteristiques[0].percentToHaveTheCaracteristic;
}
}
getCaracteristiques(){
this.caracteristiqueService.getAll().subscribe(caracteristiques => {
this.options = caracteristiques;
});
}
}