从对象数组返回单个记录

时间:2017-01-25 15:02:26

标签: javascript angularjs arrays

我有一个obj,我从db查询返回,看起来像这样。我希望能够从“contacts”数组中显示一条记录,但我现在确定这是最好的方法。

以下是我的查询输出示例:

{
    "_id": "5886e3692ca4542c453431ee",
    "initial": "u",
    "last_name": "Peterson",
    "first_name": "Pete",
    "owner_id": "5886e32c2ca4542c453431ed",
    "__v": 1,
    "contacts": [
        {
            "last_name": "Eltoro",
            "first_name": "Peter",
            "_id": "5886e3f5a219472cac886a9f",
            "businesses": [],
            "addresses": [],
            "phones": [
                {
                    "phone_type": "mobile",
                    "phone_number": "555-555-999",
                    "_id": "5886e3f5a219472cac886aa2"
                },
                {
                    "phone_type": "home",
                    "phone_number": "999-876-000",
                    "_id": "5886e3f5a219472cac886aa1"
                }
                ],
                "emails": [
                {
                    "email_address": "tim@time.com",
                    "_id": "5886e3f5a219472cac886aa0"
                }
            ]
        },
        {
            "college": "University of WA",
            "highschool": "Kalaheo",
            "birthday": "1990-12-22T08:00:00.000Z",
            "last_name": "Smith",
            "first_name": "Suzanne",
            "_id": "5886fb7fac288c2e31eabe0a",
            "businesses": [],
            "addresses": [
                {
                    "zip": "98777",
                    "state": "WA",
                    "city": "Seattle",
                    "address_2": "Apt 234",
                    "address": "124 194th St. SW",
                    "_id": "5886fb7fac288c2e31eabe0e"
                }
            ],
            "phones": [
                {
                    "phone_type": "mobile",
                    "phone_number": "206-899-9898",
                    "_id": "5886fb7fac288c2e31eabe0d"
                },
                {
                    "phone_type": "home",
                    "phone_number": "206-789-0987",
                    "_id": "5886fb7fac288c2e31eabe0c"
                }
            ],
            "emails": [
                {
                    "email_type": "personal",
                    "email_address": "suzanne@smith.com",
                    "_id": "5886fb7fac288c2e31eabe0b"
                }
            ]
        },
        {
            "last_name": "Alabaster",
            "first_name": "Cindy",
            "_id": "5888b0bd3c025e54476828d9",
            "businesses": [],
            "addresses": [],
            "phones": [
                {
                    "phone_type": "home",
                    "phone_number": "999-999-0909",
                    "_id": "5888b0bd3c025e54476828dc"
                },
                {
                    "phone_type": "home",
                    "phone_number": "000-000-0000",
                    "_id": "5888b0bd3c025e54476828db"
                }
            ],
            "emails": [
                {
                    "email_address": "Some@them.com",
                    "_id": "5888b0bd3c025e54476828da"
                }
            ]
        }
    ],
    "businesses": [],
    "addresses": [],
    "phones": [
        {
            "phone_number": "999-999-9999",
            "phone_type": "mobile",
            "_id": "5886e37f2ca4542c453431ef"
        }
    ],
    "emails": []
}

在我的角度代码中,我想抓住其中一个“联系人”记录并显示它。

执行此操作的最佳方法是执行ng-repeat并按ID过滤?

2 个答案:

答案 0 :(得分:0)

我会使用ng-repeat和过滤器

$scope.selectedId = "0"

$scope.yourJson = {...}

<input type="text" ng-model="selectedId"></input> // you can enter an id of a contact

<div ng-repeat="contact in yourJson.contacts | filter:{_id: selectedId}">
    {{contact.last_name}}
</div> // it will show the last_name of the contact of which you inputed the id

答案 1 :(得分:0)

如果您想显示仅一个联系人的信息(例如第一个),您可以执行以下操作:

<p>{{yourObjectName.contacts[0].last_name}}</p>
<p>{{yourObjectName.contacts[0].first_name}}</p>
...
<ul>
    <li ng-repeat="phone in yourObjectName.contacts[0].phones">
        Phone type: {{phone.phone_type}}, phone number: {{phone.phone_number}} 
    </li>
</ul>