bootstrap-select 下拉选项有时未加载

我正在使用 bootstrap-select 1.12.4 版本和 Angular 4.3.5。

我正在尝试使用 http 调用和异步管道加载下拉选项。

我面临的问题是，刷新页面时，大多数情况下都不会加载选择下拉选项。但有时选项会加载。我不确定我在这里犯了什么错误。有人能帮我一下吗？提前致谢。

组件.ts

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';    
import { Observable } from 'rxjs';

@Component({
  selector: 'app-bob-report',
  templateUrl: './bob-report.component.html',
  styleUrls: ['./bob-report.component.css']
})
export class BobReportComponent implements OnInit {

  observableOptions: Observable<any>;

  constructor(private http: HttpClient) { }

  ngOnInit() {
    this.observableOptions = this.http.get('assets/data/users.json');
  }

}

组件.html

<form>
  <div class="form-group">
    <label for="sel1">Select list (select one):</label>
    <select class="selectpicker" data-live-search="true">
      <option *ngFor="let option of observableOptions | async" value={{option.id}}> {{option.value}} </option>
    </select>
  </div>
</form>

附上两张图片，一张有问题，另一张没有问题。

你好，萨米，我知道现在回答已经太晚了，因为你的答案在视图中调用 {{refreshSelect() }} 是正确的，但它进入无限循环，这会破坏引导选择，但是我找到了正确的解决方案，可能是这样可以拯救某人的一天。

  this.http.get('http://google.com').subscribe(data => {
    console.log(data);
  }, error => {
    console.log(error);
  }, () => {
    setTimeout(() => {
      $('.selectpicker').selectpicker('refresh');
    });
  });

看一下第三个参数，它是 subscribe 方法中的回调，可用于在内容加载后刷新选择器。