使用 Ng-Repeat 绑定到数组中的数组答案

【问题标题】：Binding To An Array Within An Array with an Ng-Repeat使用 Ng-Repeat 绑定到数组中的数组
【发布时间】：2015-02-02 15:04:21
【问题描述】：

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

$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 和绑定中更改什么代码，以获取第二个数组中的“名称”对象以重复而不是第一个数组中的“名称”对象？

【问题讨论】：

标签： javascript arrays angularjs binding ng-repeat

【解决方案1】：

<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>

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

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

【讨论】：

【解决方案2】：

我认为您正在寻找打印selectedWorkflow 的步骤，对吗？所以，迭代（即ng-repeat）selectedWorkflow.Steps：

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

【讨论】：

非常感谢！我已经尝试了所有方法，但它成功了！我对此很陌生。谢谢！