如何删除角质下拉菜单的选择选项

时间:2018-09-13 20:44:22

标签: angular

我正在尝试从primng drowdown中删除项目

初始化

ngOnInit() {
    this.characterList = [  
       {  
          "label":"Select character",
          "id":"-1"
       },
       {  
          "label":"New",
          "id":"0"
       },
       {  
          "id":32,
          "label":"Test2 "
       }
    ]
    this.character =  {  
              "id":"32",
              "label":"Test2 "
           }
}

删除功能

delete(): void {
    this.characterList.forEach((item, index) => {
      if (+this.character.id === +item.id)
        this.characterList.splice(index, 1);
    });
}

html:

<p-dropdown [options]="characterList" [(ngModel)]="selectedCharacter" (onChange)="selectCharacter($event)" optionLabel="label"></p-dropdown>
<button pButton type="button" label="Delete character" (click)="delete()"></button>

但是由于某些原因,p下拉列表没有更新。我在做什么错了?

2 个答案:

答案 0 :(得分:0)

好的,我不确定为什么会这样,但是删除optionLabel="label"可以解决问题,当然您也可以使用ngModel来解决问题。

答案 1 :(得分:0)

我找到了解决问题的一种方法。这是有效的示例代码:

HTML:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="Toolbar text"
        android:gravity="center"/>

</android.support.v7.widget.Toolbar>

JS

<p-dropdown [options]="cities" [(ngModel)]="selectedCity" optionLabel="name" #drop></p-dropdown>
<button (click)="delete(drop)">DELETE</button>

因此,您似乎必须手动更新选项才能刷新。