Question

我试图从对象的属性中打印出每个数组项：

{
        position:"Finance Office Assistant",
        employer:"Washtenaw County Finance Department",
        location:"Ann Arbor, MI",
        start_date:"2012",
        current: false,
        end_date:"2012",
        duties: [
            "Item 1",
            "Item 2",
            "Item 3" 
        ]
    },

此对象位于数组中，包含其他几个对象。我试图创建一个循环遍历所有对象的函数，并打印出无序列表中的 tasks 数组项，其中包含列表项和数组项的确切数量。

这是我试图编写任务的功能

$scope.dutyList = function() {
    var arrayLength = $scope.duties.length;
    while (arrayLength > 0) {
        console.log("dutyList run")
        document.write("<li> {{ dutyList }} </li>");
        --arrayLength;
    }
}

Answer 1

您不需要处理此类数据的功能。 Angular的ngRepeat就是为了这个。要访问数据集的第二级，您可以在无序列表中嵌套两个重复。第一个（在div中）重复数据的第一层，并公开第二层，在<li>标记中重复：

  <ul>
      <div ng-repeat="d in data">
        <li ng-repeat="duty in d.duties">{{duty}}</li>  
      </div> 
  </ul>

Plunker

Answer 2

作为一般规则，在使用Angular等框架时，您不希望直接写入文档。相反，您应该使用内置的模板系统和指令来呈现您的页面。

我在这里对最终目标做了一些假设，但是，假设控制器可以访问对象数组并附加到范围，您可以使用以下内容打印每个位置的无序职责列表

GTA

angular.module('myApp', []).controller('myCtrl', function($scope){
  $scope.foo = [{
        position:"Finance Office Assistant",
        employer:"Washtenaw County Finance Department",
        location:"Ann Arbor, MI",
        start_date:"2012",
        current: false,
        end_date:"2012",
        duties: [
            "Item 1",
            "Item 2",
            "Item 3" 
        ]
    }, {
        position:"Another Position",
        employer:"Another Employer",
        location:"Ann Arbor, MI",
        start_date:"2012",
        current: false,
        end_date:"2012",
        duties: [
            "2nd Object, Item 1",
            "2nd Object, Item 2",
            "2nd Object, Item 3" 
        ]
    }];
});

我试图在Angular JS的Javascript中使用循环来打印数组

2 个答案: