如何将数组转换为对象并遍历 angular 5 中的列表？

Question

JSON：我有 json，我想在其中迭代列表中的用户标识，但我能够获取用户标识，但不能获取列表中的内容。

{
    "data": {
        "items": [
            {
                "regions": "India",
                "ownerids": "[master]",
                "userids": "[\"sia(123), Smith James(124)\"]",
                "groupid": "111",
                "groupname": "Gopi_test1"
            },
        ]
    }
}

html：在此我使用 userids 以便它打印为 "sia(123), Smith James(124)\" 但我面临以列表形式显示为 sia 和 smith james 的问题，即 1) 亚洲 2) 史密斯·詹姆斯

<li *ngFor= "let member of userids">
<span><input  type="checkbox"/>
 <label>{{member}}</label></span>
</li>



Component:// This is my component and hidden some part of code...
@Component({
  selector: 'app-group',
  templateUrl: './group.component.html',
  styleUrls: ['./group.component.css']
})
export class GroupComponent implements OnInit {    
    userids :any[];

     ngOnInit() {
    this.service.getGroupMembers().subscribe(data => {this.userids = data.data.items});
    }
//some part of code is hidden 
}

Answer 1

您似乎至少可以在一定程度上控制您接收的数据的结构。以下是我建议您更改的一些内容。

尽量不要将多个值组合成一个字符串。将它们分开将使您可以更好地控制以后如何使用数据。它还将使您不必不必要地解析值
使用数组，其中多个值应该组合在一起
相应地命名您的属性，对数组使用复数，对单个值使用单数

我创建了一个简单的演示，它将呈现您想要的列表。或许可以作为示范。

DEMO

如何将数组转换为对象并遍历 angular 5 中的列表？

How to convert array into object in and iterate over list in angular 5?

arrays

json

object

angular5