Angular 8 个下拉选项默认更新后的最后一个新值 ArrayList

Question

我正在使用 Angular 8 (TypeScript)。

我想 select 默认情况下调用服务后在数组集合中聚合的最后一个值并更新数组的值，但始终显示占位符。 我该怎么做？

<nb-select [(selected)]="selectedNumberCase" 
           placeholder="Select value" shape="round" size="small" 
            class="col-md-7 custom-padding" >
    <nb-option *ngFor="let item of caseNumberArray" (click)="onMenuItemSelected(item.value)"[value]="item.id">{{item.value}}</nb-option>
</nb-select>


populateNumberCase(newId:string,newValue:string){
    this.caseNumberArray.push({
        id:element.newId,
        value:element.newValue
    });
}

callService(){
    .......do something
    this.populateNumberCase(result.Id,result.Value);
    this.selectedNumberCase = result.Value;
}

Answer 1

尝试这个。

假设您将在此变量中包含数组 object

初始化一个变量；

selectedOption;

在 ngOnit() function 中复制以下行。

this.selectedOption= this.selectedNumberCase[this.selectedNumberCase.length-1];

模板代码::

<nb-select [(selected)]="selectedOption" placeholder="Select value" shape="round" size="small" 
            class="col-md-7 custom-padding" >
      <nb-option
        *ngFor="let item of caseNumberArray"
        (selectionChange)="onMenuItemSelected(item.value)"
        [(value)]="item.id">
        {{ item.value}}
      </nb-option>
    </nb-select>

Answer 2

试试下面的代码。 如果不起作用，请尝试将“selectionChange”替换为“change”

<nb-select [(selected)]="selectedNumberCase" placeholder="Select value" shape="round" size="small" 
            class="col-md-7 custom-padding" >
      <nb-option
        *ngFor="let item of caseNumberArray"
        (selectionChange)="onMenuItemSelected(item.value)"
        [(value)]="item.id">
        {{ item.value}}
      </nb-option>
    </nb-select>