Question

我有两个国家和州的json数组。现在我必须根据国家选择来过滤状态下拉。

    The two JSON arrays are like this.
    $scope.countries = [{id:1,json:{'key':'1',value:'INDIA'}},{id:2,json:{'key':'2',value:'USA'}}];
    $scope.states = [{id:1,json{'key':'1',value:'MAHARASTRA',prntkey:'1'}},{id:2,json{'key':'2',value:'TELANGANA',prntkey:'1'}},{id:3,json{'key':'3',value:'NEW YORK',prntkey:'2'}},{id:4,json{'key':'4',value:'TEXAS',prntkey:'2'}}].
    I am binding these json arrays to select tags of country and state using ng-options.

<select ng-model="country" ng-options="option as option.json.value for option in countries  track by option.json.key">
      <option value="">- Select -</option>
 </select>

<select ng-model="state" ng-options="option as option.json.value for option in states | filter:{prntkey:country.json.key} track by option.json.key">
       <option value="">- Select -</option>
 </select>

现在，如果我选择国家为INDIA，则应在状态下拉列表中填充相应的州（MAHARASTRA，TELANGANA）。上面的代码不起作用。任何人都可以纠正上述代码中的错误。提前谢谢。

Answer 1

在第二个下拉列表中，您使用深度属性“prntkey”进行过滤。要使用深度/嵌套属性进行过滤，需要提供完整的属性路径。使用 filter:{json: {prntkey:country.json.key}} 代替 filter:{prntkey:country.json.key}

<强>更新如果未选择国家/地区，则为了保持状态下拉列表为空，您可以使用自定义过滤器功能。

在控制器中添加以下功能

$scope.filterState = function(input){
  return $scope.country && $scope.country.json.key === input.json.prntkey;
};

并将状态过滤器filter:{prntkey:country.json.key}替换为filter: filterState

如何在嵌套的json对象的情况下对ng-options应用过滤器

1 个答案: