Angular

Question

<select class="form-control" formControlName="recipe_ingredient">
          <option value="">Select Ingredient</option>
          <option *ngFor="let ingredient of ingredients | async" [value]="ingredient.id" [selected]="ingredient.id == ri.ingredient">
           {{ingredient.id}}-{{ingredient.name}}
          </option>

ri.ingredient = 2;但下面的代码在上面的代码中 return 不正确，因此未选择值

ingredient.id == ri.ingredient

谁能指导一下

我的ts文件中的代码如下：

editRecipeForm() {
    this.editrecipeForm = this.fb.group({
      recipe_name: ['', Validators.required ],
      recipe_description: ['', Validators.required ],
      edit_recipe_image: [],
      ingredients11: this.fb.array([
         this.getIngredient()
      ])
   });
  } 12:49 
getIngredient() {
    return this.fb.group({
     recipe_ingredient: ['', Validators.required ],
      recipe_ingredient_quantity: ['', Validators.required ]
    });
  }

Answer 1

我想你只需要 select 标签中的 ngModel :

<select class="form-control" formControlName="recipe_ingredient" [(ngModel)]="ri.ingredient">

WORKING DEMO

Angular - 在下拉列表中设置选定值

Angular - Set Selected value in Dropdown

ngrx

ngxs