如何在Angularjs的select选项中访问另一个对象中的对象的名称和id

Question

[
  {
    "pcategorys": [
      {
        "name": "abc",
        "id": 1,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "xyz",
        "id": 2,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "pqr",
        "id": 19,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "def",
        "id": 20,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      }
    ],
    "companystone": [],
    "company_name": "ABB Company",
    "company_code": "ABB",
    "active_status": 1,
    "delete_status": 0,
    "id": 10,
    "createdAt": null,
    "updatedAt": null
  },
  {
    "pcategorys": [
      {
        "name": "qwe",
        "id": 24,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "qwert",
        "id": 26,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "asdf",
        "id": 28,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      }
    ],
    "companystone": [],
    "company_name": "asdf Comapny",
    "company_code": "asdf",
    "active_status": 1,
    "delete_status": 0,
    "id": 11,
    "createdAt": null,
    "updatedAt": null
  }
]

我试图访问'pcategorys'对象中的'id'和'name'，我想根据外部对象的'id'过滤结果，即“id”：10或“id”：11

我试过下面的代码，但它不能正常工作

<select class="form-control" ng-model="selectedCategory" ng-options="item.pcategorys.id as item.pcategorys.name for item in pcategorys | filter id : selectedCompanyID "></select>

任何人都可以帮助我..

Answer 1

试试这样。

angular.module("todoApp", [])
 .controller("mainCtrl", function($scope){
   $scope.cats = [
  {
    "pcategorys": [
      {
        "name": "abc",
        "id": 1,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "xyz",
        "id": 2,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "pqr",
        "id": 19,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "def",
        "id": 20,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      }
    ],
    "companystone": [],
    "company_name": "ABB Company",
    "company_code": "ABB",
    "active_status": 1,
    "delete_status": 0,
    "id": 10,
    "createdAt": null,
    "updatedAt": null
  },
  {
    "pcategorys": [
      {
        "name": "qwe",
        "id": 24,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "qwert",
        "id": 26,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      },
      {
        "name": "asdf",
        "id": 28,
        "createdAt": null,
        "updatedAt": null,
        "subcategory": []
      }
    ],
    "companystone": [],
    "company_name": "asdf Comapny",
    "company_code": "asdf",
    "active_status": 1,
    "delete_status": 0,
    "id": 11,
    "createdAt": null,
    "updatedAt": null
  }
]
    
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="todoApp" ng-controller="mainCtrl as keyVar" class="container">
 
  <select class="form-control" ng-model="filterCat" ng-options="cat.id for cat in cats"></select>
 <select class="form-control" ng-model="selectedCategory" ng-options="item.id as item.name for item in filterCat.pcategorys"></select>

</div>

Answer 2

试试这个：

<div ng-repeat="n in pcategorys | filter : { 'id' : selectedCompanyID }">
   <select ng-model="selectedCategory" ng-options="item.id as item.name for item in n.pcategorys"></select>
</div>

Answer 3

首先尝试在外部div上添加一个过滤器，然后在子select元素中获取filteredObject，从对象中获取选项。

注意：如果没有您正在过滤的duplicateId，这将按预期工作。

尝试下面的代码段。希望它能帮到你！

function sampleController($scope) {

$scope.mySampleData = [{
  "pcategorys": [{
    "name": "abc",
    "id": 1,
    "createdAt": null,
    "updatedAt": null,
    "subcategory": []
  }, {
    "name": "xyz",
    "id": 2,
    "createdAt": null,
    "updatedAt": null,
    "subcategory": []
  }, {
    "name": "pqr",
    "id": 19,
    "createdAt": null,
    "updatedAt": null,
    "subcategory": []
  }, {
    "name": "def",
    "id": 20,
    "createdAt": null,
    "updatedAt": null,
    "subcategory": []
  }],
  "companystone": [],
  "company_name": "ABB Company",
  "company_code": "ABB",
  "active_status": 1,
  "delete_status": 0,
  "id": 10,
  "createdAt": null,
  "updatedAt": null
}, {
  "pcategorys": [{
    "name": "qwe",
    "id": 24,
    "createdAt": null,
    "updatedAt": null,
    "subcategory": []
  }, {
    "name": "qwert",
    "id": 26,
    "createdAt": null,
    "updatedAt": null,
    "subcategory": []
  }, {
    "name": "asdf",
    "id": 28,
    "createdAt": null,
    "updatedAt": null,
    "subcategory": []
  }],
  "companystone": [],
  "company_name": "asdf Comapny",
  "company_code": "asdf",
  "active_status": 1,
  "delete_status": 0,
  "id": 11,
  "createdAt": null,
  "updatedAt": null
}];
  $scope.selectedCompanyID = 11;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app>
  <div ng-controller="sampleController">
    <div ng-repeat="categoryObj in mySampleData | filter : { 'id' : selectedCompanyID }">
   <select ng-model="selectedCategory" ng-options="item.id as item.name for item in categoryObj.pcategorys"></select>
</div>
  </div>
</body>