角度：引导程序无法触发选择选项，因为使用ngFor动态绑定了选项

Question

我有一个选择列表，该列表动态地加载到我的组件中，并且选择列表已应用了引导程序，但是最初在引导程序运行时，它在select中找不到任何选项，因此无法应用于选择列表。

我尝试了此处提供的解决方案 {{3}}

但没有帮助。

组件 HTML ：

***********
*         *
*your name*
*         *
***********

加载 json ：

[       {        “ bedroomsid”：“ 1”，        “卧室”：“ Studio Apt”      }，      {        “ bedroomsid”：“ 2”，        “卧房”：“ 1 BHK”      }，      {        “ bedroomsid”：“ 3”，        “卧房”：“ 2 BHK”      }，      {        “ bedroomsid”：“ 4”，        “卧房”：“ 3 BHK”      }，      {        “ bedroomsid”：“ 5”，        “卧房”：“ 4 BHK”      }，      {        “ bedroomsid”：“ 6”，        “卧房”：“ 5 BHK”      }，      {        “ bedroomsid”：“ 7”，        “卧房”：“ 6 BHK”      }，      {        “ bedroomsid”：“ 8”，        “卧房”：“ 7 BHK”      }，      {        “ bedroomsid”：“ 9”，        “卧房”：“ 8 BHK”      }，      {        “ bedroomsid”：“ 10”，        “卧房”：“ 9 BHK”      }    ]

生成的HTML ：

<div class="hero-image-bedrooms form-group">
    <select class="form-control" title="Bedrooms" id="selectbedroom">
        <option class="bs-title-option" value="">Select Bedroom</option>
       <option *ngFor="let keys of bedroommstkey" 
        value="{{bedroommst[keys].bedroomsid}}">{{bedroommst[keys].bedrooms}}</option> 
      </select>
</div>

就像在生成的HTML中一样，生成的ul没有在选择选项中列出动态项目。

请帮助提供适当的答案

Answer 1

问题为 dsn

应该（考虑到您可能是从服务获取此json）； <option *ngFor="let keys of bedroommstkey" value="{{bedroommst[keys].bedroomsid}}">{{bedroommst[keys].bedrooms}}</option>

相关的 HTML ：

<option *ngFor="let keys of bedroommstkey" value="{{keys?.bedroomsid}}">{{keys?.bedrooms}}</option>

相关的 TS ：

<div class="hero-image-bedrooms form-group">
  <div *ngIf="bedroommstkey.length>0">
    <select class="form-control" title="Bedrooms" id="selectbedroom">
        <option class="bs-title-option" value="">Select Bedroom</option>
       <option *ngFor="let keys of bedroommstkey" 
        value="{{keys?.bedroomsid}}">{{keys?.bedrooms}}</option> 
      </select>
  </div>
</div>

简单的stackblitz demo