Question

我是AngularJS的新手并且遇到以下问题：我有两个选择框，我填充了存储在外部JSON文件中的数据。我想动态填充第二个框，具体取决于在第一个框中选择的项目。第一个框中的每个项都有一个名为relation的键。我想使用此键的值作为动态更新第二个框中可用项目的触发器。

任何人都可以帮我这个吗？我已经尝试编写一个函数，但它不起作用。 Thanx提前。这是JSON结构：

{
"filterElements": [
    {
        "parameters": [
            {
                "paraName": "paraOne",
                "relation": "default"
            },
            {
                "paraName": "paraTwo",
                "relation": "default"
            },
    {
                "paraName": "paraThree",
                "relation": "defaultshort"
            }
        ]
    },
    {
        "relations": [
            {
                "defaultrelation": 
        [
                    "equals",
                    "does not equal",
                    "greater than",
                    "less than"
                ]
            },
            {
                "defaultshort": 
        [
                    "equals",
                    "does not equal"
                ]
            }
        ]
    }
]

}

MyFiddle

Answer 1

基于你的小提琴，你错过了引导应用程序。例如：

<body ng-app="list">
 ...
</body>

之后，您需要将ListCtrl注册到现有应用程序。

var app = angular.module('list',[]);

app.controller('ListCtrl', ListCtrl);

function ListCtrl($scope, $http) {
   ...
}

执行此操作后，您的控制器将被执行，您将被请求并且您可以将数据绑定到您的视图。

Answer 2

我明白了。如果有人有兴趣，这是解决方案：

$scope.change = function (paraSelection) {
$scope.filteredrelations = [];
for(var key in $scope.relations){
  if(angular.isDefined($scope.relations[key][paraSelection.relation])){
    $scope.filteredrelations = $scope.relations[key] paraSelection.relation];
        }
    }
};

完整的工作示例可以在这里找到： Plunker

使用AngularJS根据JSON数据动态更新选择框

2 个答案: