0

我有一个与以下示例类似的应用程序，但我不知道为什么源数据没有更新。更多信息在示例评论中。我确信这是我忽略的一些微不足道的问题。

控制器

    $scope.items = [
        { id: 1, color: 'red', title: 'car' },
        { id: 2, color: 'blue', title: 'sky' },
        { id: 3, color: 'transparent', title: 'nothing' }
    ]
    $scope.favoriteIds = [1, 2, 3]
    $scope.getItem = function(id) { /* returns an item with given id */ }

最后，有两种方法可以修改$scope.items，但只有第一种有效，因为新项目获得了not-already-known id。

    $scope.changeData1 = function() {
        $scope.items = [{ id: 666, color: 'ugly', title: 'face' }]
        $scope.favoriteIds = [666]
    }

    $scope.changeData2 = function() {
        $scope.items = [{ id: 1, color: 'ugly', title: 'face' }]
        $scope.favoriteIds = [1]
    }

看法

<h1>Favourite items</h1>

<ul ng-repeat="id in favoriteIds" data-ng-init="item = getItem(id)">
    <li>I like my {{ item.color }} {{ item.title }}</li>
</ul>

<button ng-click="changeData1()">Modify data</button>
<!-- prints: I like my ugly face -->

<button ng-click="changeData2()">Modify nothing</button>
<!-- prints: I like my red car -->

问题是，我需要使用第二种方式来修改数据。

http://jsfiddle.net/4pEpN/7/

4

2 回答 2

2

我对 Angular 也比较陌生，所以如果有一种简单的方法可以做到这一点，我不知道它是什么（不幸的是，Angular 文档很糟糕）。无论如何，您可以通过重新考虑代码的结构来避免这种情况（您最终也会得到一个更好的程序）。

在您看来，您正在使用在循环的每次迭代期间ng-init调用。这就是导致您的问题的原因，并且（显然）是由于 Angular 性能特性（更多在这个问题上）。getItemidng-repeat

基本上，不要使用except 在您的应用程序启动ng-init时执行某些操作。否则，您最终将得到您现在所拥有的：视图中的逻辑（调用）而不是它所属的模型。getItem(id)

相反，使用ng-repeat重复您要显示的确切数据。就像我之前说的，这意味着一些代码重新排列。例如，您可以使用函数即时生成用户当前的项目列表。看看这个小提琴：http: //jsfiddle.net/4pEpN/19/

有关我所做的所有更改，请参阅该代码中的注释，但最相关的是：

$scope.favoriteItems = function() {
    var favObjs = [];
    for (var i = 0; i < favoriteIds.length; ++i) {
        favObjs.push(getItem(favoriteIds[i]));
    }
    return favObjs;
};

那么在你看来：<ul ng-repeat="item in favoriteItems()">

您还可以使用许多其他方法。例如，您可以有一个update函数，它处理任何用户输入后可能需要完成的任何事情（包括更新用户的自定义项目数组）。然后你可以在你的changeData函数中调用它。

于 2013-07-22T21:12:48.523 回答
2

我认为ng-init不合适，因为它只影响模板初始化。那么如何只调用你getItem(id)来获取每个属性，如下所示：http: //jsfiddle.net/JrvbD/1/

于 2013-07-22T21:13:06.043 回答