小编Sha*_*nCL的帖子

我正在尝试使用AngularJS创建链接/级联下拉列表(选择元素),但我很难使用我的对象属性过滤和更新"选定"属性.

首次加载页面时,将筛选所选项目并正确显示在下拉列表中.一旦我更改了父下拉列表,子选择项就不会抓取筛选列表中的第一项,导致孙子下拉列表不更新.

任何见解都会非常感激,并注意我将父/子/孙子数组分开(而不是在子数组中),因为我最终将从SQL中的单独spocs/tables中提取数据.如果有一种简单的方法可以在JSON中创建子数组,那么我愿意更改数据结构.

这是一个编码示例的链接

HTML

<div ng-controller="dropdownCtrl" >                    
  <div>
     <select 
       ng-model="selectedParentItem"                        
       ng-options="p.displayName for p in parentItems">                        
     </select>
  </div>
  <div>
     <select                                                    
       ng-model="selectedChildItem"                     
       ng-options="c.displayName for c in filteredArray | filter:{parentId:           
         selectedParentItem.id}">                        
     </select>
  </div>
  <div>
     <select                                                    
       ng-model="selectedGrandChildItem"                        
       ng-options="g.displayName for g in grandChildItems | filter:{parentId: 
         selectedChildItem.parentId}">                        
     </select>
  </div>
</div>

调节器

function dropdownCtrl($scope, filterFilter) {
$scope.parentItems = [
    {
        "id": 0,
        "displayName": "parent 00"
    },
    {
        "id": 1,
        "displayName": "parent 01"
    },
    {
        "id": 2,
        "displayName": "parent 02"
    }
  ];
$scope.selectedParentItem = $scope.parentItems[0];

$scope.childItems …