Question

这是我的js的样子

$scope.tasks = [
    {
    "name":"task 1",
    "date":"2 May 2014"
    },

    {"name":"task 2",
    "date":"2 May 2014"
    }
];

HTML

<ul ng-repeat="task in tasks">
    <li>{{task.name}}</li>
</ul>

我想尽量避免{{task.name}}让我的标记更清晰。我在$scope.tasks = $scope.tasks.name;中尝试了JS，但它无效。

Answer 1

$scope.tasks = [
    {
    "name":"task 1",
    "date":"2 May 2014"
    },

    {"name":"task 2",
    "date":"2 May 2014"
    }
];

var temp = [];

for(var task in $scope.tasks){
    temp.push(task.name);
}

$scope.tasks = temp;

~~这会做你想要的。但是，它会覆盖原始对象~~

我认为你过于复杂的事情，并且很难绕过Angular的基本概念。

就个人而言，我甚至认为这会让事情变得更糟。在ng-repeat中，您告诉Angular应该列出task中的每个tasks。然后，它应显示每个任务的名称。这显然是任务名称task.name。省略术语task，您的代码将难以阅读，因为您无法看到名称的含义。

Answer 2

这是如何做到的。

在您的控制器中，您需要注意更改：

// Run whenever tasks changes.
$scope.$watch("tasks", function(tasks) {
  // Tasks may be be undefined or nil.
  if (tasks) {
    // Map the array to pick out the titles.
    $scope.taskTitles = tasks.map(function(task) { return task.title })
  }
}

如果您不这样做，那么每当任务发生变化时，您的列表都不会更新。这个＆＃39;观看＆＃39;是Angular的基本组成部分。

然后在你的模板中你需要迭代。

<ul ng-repeat="task in taskTitles track by $index">
    <li>{{task}}</li>
</ul>

如果您的图书有可能重复，则需要track by。

所以你可以做到，但它并不干净。我建议你坚持使用你拥有的东西。

在js中处理对象属性访问

2 个答案: