Angularjs 具有嵌套 json 的过滤器

Question

我在使用以下 json 对象过滤 table 时遇到问题。它过滤了一些键值，但如果我的 json 是嵌套的，它就不起作用。我确定我做错了事而且很愚蠢。

这是相同的 fiddle。 https://jsfiddle.net/pnypxhj8/1/

下面是我的 JSON 对象：

[
 {
    "EmpId": "3901",   //----> Filter works on this
    "SubmitDate": "30/04/2017", //----> Filter works on this
    "Employee": "John", //----> Filter works on this
    "ProdRequest": [{
            "ProdName": "Mac Air laptop - Apple",
            "ManagersApproval": {
                "Status": "Approved",  //----> But Doesnt works on this
                "ManagersDetails": [{
                        "Name": "Steve Rock",
                        "Email": "steve.rock@test.com"
                    },
                    {
                        "Name": "Mary Nuts",
                        "Email": "mary.nuts@test.com"
                    }
                ],
                "Comments": ""
            },
            "AdminApproval": {
                "Status": "Pending",
                "AdminDetails": [{
                        "Name": "Hardy Lee",
                        "Email": "Hardy.Lee@test.com"
                    },
                    {
                        "Name": "Moss Grant",
                        "Email": "Moss.Grant@test.com"
                    }
                ],
                "Comments": ""
            },
            "RequestStatus": "Pending"
        },
        {
            "ProdName": "Note Book - Large",
            "ManagerApproval": {
                "Status": "Approved",
                "Approver": [{
                    "Name": "Jet Lee",
                    "Email": "jet.lee@test.com"
                }],
                "Comments": "Approved by Jet Lee"
            },

            "AdminApproval": {
                "Status": "Approved",
                "AdminDetails": [{
                        "Name": "Hardy Lee",
                        "Email": "Hardy.Lee@test.com"
                    },
                    {
                        "Name": "Moss Grant",
                        "Email": "Moss.Grant@test.com"
                    }
                ],
                "Comments": ""
            },
            "RequestStatus": "Completed"
        }
    ]
},
{
    "EmpId": "550",
    "SubmitDate": "22/04/2017",
    "Employee": "Mary Kom",
    "ProdRequest": [{
            "ProdName": "Seagate Harddisk 500TB",
            "ManagersApproval": {
                "Status": "Approved",
                "ManagersDetails": [{
                        "Name": "Steve Rock",
                        "Email": "steve.rock@test.com"
                    }
                ],
                "Comments": ""
            },
            "AdminApproval": {
                "Status": "Approved",
                "AdminDetails": [{
                        "Name": "Hardy Lee",
                        "Email": "Hardy.Lee@test.com"
                    },
                    {
                        "Name": "Moss Grant",
                        "Email": "Moss.Grant@test.com"
                    }
                ],
                "Comments": ""
            },
            "RequestStatus": "Approved"
        },
        {
            "ProdName": "Note Book - Large",
            "ManagerApproval": {
                "Status": "Approved",
                "Approver": [{
                    "Name": "Jet Lee",
                    "Email": "jet.lee@test.com"
                }],
                "Comments": "Approved by Jet Lee"
            },

            "AdminApproval": {
                "Status": "Approved",
                "AdminDetails": [{
                        "Name": "Hardy Lee",
                        "Email": "Hardy.Lee@test.com"
                    },
                    {
                        "Name": "Moss Grant",
                        "Email": "Moss.Grant@test.com"
                    }
                ],
                "Comments": ""
            },
            "RequestStatus": "Completed"
        }
    ]
}

]

Answer 1

首先：您在对象属性上有错字。您在过滤器上有 ManagerApproval，但您的数据中有 ManagersApproval（带 S）属性。

其次：过滤器应该是ng-repeat="a in data.ProdRequest | filter:{ProdName: prodName, ManagerApproval: { Status: managerApproval }}"

这是工作 fiddle：https://jsfiddle.net/pnypxhj8/3/

Angularjs 具有嵌套 json 的过滤器

Angularjs filter with nested json

angularjs

json

angularjs-filter