如何在Angular 5的下拉列表中设置选定的值？

Question

我有以下html选择代码：

<div class="form-group"> 
    <label class="control-label" for="state">State</label>
    <select class="selectpicker" [(ngModel)]="trip.state">
        <option *ngFor="let s of states" [ngValue]="s.state">{{s.state.name}} 
        </option>
    </select>
</div>

组件ts文件：

...
export class Trip1Component implements OnInit {

  @Input() public trip: Trip;
  public countries: Country[] = [];
  public states: State[] = [];
...

loadStates() {
    this.http.get<State[]>(`${this.baseUrl}/States/${this.selectedCountry.code}`, httpOptions).subscribe(
      data => { this.states = data; },
      err => console.error(err),
      () => setTimeout(() => {
        $('.selectpicker').selectpicker('refresh');
    }, 10)
    );
  }

州实体：

export interface State {
    id: number;
    code: string;
    name: string;
  }

来自控制台的状态列表： 选中状态未显示在列表中，当我在页面上显示trip.state.name字符串时，我得到正确的值！但下拉列表不是 选择。我试过用[ngValue] =“s”和[ngValue] =“s.state” 如上所示，Trip来自使用@input注释的父组件。 知道如何让这个工作吗？