Angular Dropdown Multiselect

Question

我正在尝试使用此link

中的Angular 4下拉菜单选项

我想从我的数据库中获取用户。

打字稿文件：

this._httpWebService.Usermulti()
    .subscribe(res => {
        const userData = res;
        this.testar = userData.data.userList;
        this.myOptions=this.testar;
        console.log(this.testar);
    });

HTML文件：

<ss-multiselect-dropdown [options]="myOptions" [(ngModel)]="share" (change)="onChange($event)" [ngModelOptions]="{standalone:true}">
</ss-multiselect-dropdown>

结果我在控制台日志中有一个对象数组，但我在前面的multiselect中得到了空选项。

我正在使用后端GraphQL和前端的角度5。

Answer 1

[{"Id": "RH001", "firstName": "Mario Abdi " }, 
{ "Id": "RH002", "firstName": "Karim Sbain " }, 
{ "Id": "RH003", "firstName": "Sarra Kari " }, 
{ "Id": "RH004", "firstName": "Mehdi Kn " } ] 

     我认为

和myOptions必须是这样的：

 this.myOptions = 
 [{id:"1", name: 'Marouen Abdi' }, 
 { id: "2", name: 'Hatem Abdi' },];

好吧，您的字段 userData.data.userList 似乎不会传递一个对象，而是一个普通的JSON字符串。

请在将其绑定到您的网页之前尝试解析它：

    this.testar = JSON.parse(userData.data.userList);
    this.myOptions=this.testar;
    console.log(this.testar);