Angular-js-填充復選框並根據JSON文件對其進行跟蹤

Question

我在JSON中有一個嵌套的對象，我需要根據JSON文件中的（動態）內容填充復選框，這意味着我事先不知道字段的名稱或可能有多少個元素。 這是一個示例，但可能會有更多的孩子，並且每個孩子中可能有更多或更少的物品。

{
"Parent":{

 "Child" : 

        {
            "Child_01" : {

                "description_01":false,
                "description_02":false,
                "description_03":false,
                "description_04":false,
                "description_05":false
            },


            "Child_02" : 
              {
                "something_01":false,
                "something_02":false,
                "something_03":false,
                "something_04": false
              },

              "Child_03" : 
              {
                "things_01":false,
                "things_02":false,
                "things_03":false,
                "things_04":false,
                "things_05":false
              }

        }

}
}

現在，我需要從中填充一個下拉列表（child_01，child_02，child_03 ....），並且當用戶選擇其中的一個時，我需要顯示其所有屬性的復選框。 當然可以跟蹤所選的對象。

這就是我所擁有的。

$scope.children = response.data.parent.child;
$scope.childrenList = [];

angular.forEach($scope.children, function(value1, key1){
     $scope.childrenList.push(key1);

});

和html：

<div ng-repeat="(key, data) in children">
               <input ng-model="childrenListModel" type="checkbox" name="{{child}}" value="{{child}}">{{child}}</input>

</div>

我沒有按照預期的方式工作。 任何幫助，將不勝感激。

Answer 1

您可能需要幾個嵌套的ng-repeat 。 看一下這個工作的插件： http ://plnkr.co/edit/K92JI7UlW9h6gh8SPeU5?p=preview

<div ng-repeat="child in children.Parent.Child">

  <div ng-repeat="options in child">

    <div ng-repeat="option in options">

      <div ng-repeat="(key, val) in option">

        <label for="{{key}}">
          {{key}}
          <input name="{{key}}" type="checkbox" ng-model="option[key]" />
        </label>


      </div>

    </div>
    <hr />

  </div>

</div>