使用Ng重复绑定到数组内的数组

时间:2014-12-04 16:28:07

标签: javascript arrays angularjs binding ng-repeat

我正在尝试绑定的数组中有一个数组。然后我想使用ng-repeat来显示空白div容器中第二个数组的所有“Name”项。我的代码如下所示:

$scope.workflows = [{
    Id: 1,
    Name: "Name of first workflow(*don't want to repeat*)",
    Description: "Education focus area requests",
    Steps: [{
        Id: 1,
        Name: "**Name I DO Want to Repeat**",
        Description: "The concept paper listed below",
        Action: "Get Approval From",
        Obj: "Program Officer - Group",
        AdditionalInfo: "n/a",
    }, {
        Id: 2,
        Name: "**Name I DO Want to Repeat**",
        Description: "Describe",
        Action: "Do things",
        Obj: "n/a",
        AdditionalInfo: "n/a",
    }, {
        Id: 3,
        Name: "**Name I DO Want to Repeat**",
        Description: "Describe",
        Action: "Do things",
        Obj: "n/a",
        AdditionalInfo: "Additional",
    },
]},

这是HTML

<div class="commentContainer" style="width: 100%">
    <div class="textBlue" ng-repeat="workflow in selectedWorkflow track by $index" style="width: 100%; margin-top: 7px; margin-bottom: 5px">
        {{selectedWorkflow.Name}}
    </div>
</div>

(这是我选择的工作流程来自的地方)

$scope.selectedWorkflow = {};
$scope.selectWF = function(wf) {
        $scope.selectedWorkflow = wf;
        console.log(wf);
        $scope.goAway = 1;
    }

我应该在ng-repeat和绑定中更改哪些代码,以获取第二个数组中的“Name”对象重复而不是第一个数组中的“Name”对象?

2 个答案:

答案 0 :(得分:0)

我认为您正在寻找打印selectedWorkflow的步骤,对吗?因此,迭代(即ng-repeat)超过selectedWorkflow.Steps

<div ng-repeat="step in selectedWorkflow.Steps track by $index">
   {{step.Name}}
</div>

答案 1 :(得分:0)

<div class="commentContainer" style="width: 100%">
    <div class="textBlue" ng-repeat="step in selectedWorkflow.Steps track by $index" 
          style="width: 100%; margin-top: 7px; margin-bottom: 5px">
            {{step.Name}}
    </div>
</div>

我假设您只需要所选工作流程的步骤列表。

如果是这种情况,那么您需要对所选工作流程的步骤进行重复操作。在这种情况下,在上面的模板中,每个“步骤”将代表workflow.Steps数组中的一个对象。