0

我在 URL 中有一个带有 id 的视图。加载此视图时，我调用服务并获取所有用户数据，看起来类似于。

{
    "code": 0,
    "message": "",
    "body": {
        "id": 1,
        "name": "test",
        "profile": [
            {
                "id": 2,
                "description": "admin"
            },
            {
                "id": 1,
                "description": "user"
            }
        ]
    }
}

假设用户没有配置文件，因此选择组件只有所有数组数据。在其他情况下，假设用户有一个管理员配置文件，因此选择组件具有所有数组，但 admin 是默认选择的。

在 HTML 我有

 <ng-select [multiple]="true"  name="perfiles" placeholder="{{ 'profile-placeholder' | translate }}"
        [(ngModel)]="perfiles">
        <ng-option *ngFor="let perfil of perfiles"  bindLabel="perfil.descripcion" [value]="perfil.id" >{{perfil.descripcion}}</ng-option>
      </ng-select>

结果是。

ng-选择

问题是组件不显示任何数据。显然有效，一个用户有两个配置文件，但我不知道如何显示描述。有什么帮助吗？

4

2 回答 2

0

我找到了解决方案。第一次我需要使用 Web 服务获取数组中的所有元素。然后我们需要将所有元素保存在一个变量中。

//Declare a variable 
private allElements: any= [];
//Save web response data in a variable
this.allElements= response["body"];

我们需要做同样的事情来获取数组中的用户元素。我们需要用于搜索用户元素的新 Web 服务。

//Declare a variable 
private userElements: any= [];
//Save web response data in a variable. This response only has user data.
this.userElements= response["body"];

最后在我们需要的 HTML 中。

 <ng-select [items]="allElements"  [multiple]="true" name="userElements" bindLabel="description"
 [(ngModel)]="userElements">
 </ng-select>

这会在 allElements 上创建一个循环以填充选择组件并将 userElements 显示为默认值。

于 2019-01-14T10:21:53.453 回答
0

我认为您在 html 中打错了字：

    <ng-option *ngFor="let perfil of perfiles"  bindLabel="perfil.descripcion" [value]="perfil.id" >{{perfil.descripcion}}</ng-option>

它应该是：

    <ng-option *ngFor="let perfil of perfiles"  bindLabel="perfil.description" [value]="perfil.id" >{{perfil.description}}</ng-option>

我根据您的 JSON 进行了更改，现在{{perfil.descripcion}}应该可以使用了。{{perfil.description}}bindLabel="perfil.descripcion"bindLabel="perfil.description"

于 2019-01-11T10:25:20.753 回答