Question

我有一个指令widget，其中许多指针动态地添加到页面中的三个垂直列之一。在指令中，我通过widget属性跟踪parent所在的列。我用来渲染它的HTML如下：

<div id="columns">
    <div id="column1">
        <widget data-ng-repeat="widget in widgets | filter:{parent: 'column1'}" data-widget="widget" />
    </div>
    <div id="column2">
        <widget data-ng-repeat="widget in widgets | filter:{parent: 'column2'}" data-widget="widget" />
    </div>
    <div id="column3">
        <widget data-ng-repeat="widget in widgets | filter:{parent: 'column3'}" data-widget="widget" />
    </div>
</div>

每个widget都是指定类型，因此它们各自具有不同的内容并且彼此独立。用户可以在不同的列之间拖放它们，Angular会自动更新基础数据中的parent。我的问题是，通过Angular执行此模型更新，它还会触发指令的重新加载，因此它有效地重新初始化窗口小部件，从而消除用户在其中所做的任何更改。

我有什么方法可以让Angular更新底层模型数据，但是阻止它重新渲染该更改到视图？我意识到这是Angular应该做的，但在这种情况下它是不可取的，并且足以让我考虑删除Angular。

我可以尝试将一个JSFiddle放在一起，说明如果有用的话我会遇到的问题。

Answer 1

我们可能需要查看该widget指令。

但是，如果不重新审视它，如果重新处理视图正在消除对窗口小部件所做的更新，那么窗口小部件就不是“Angular”。

我的意思是，你不应该在DOM中持久保存用户输入，你应该通过ngModel甚至自定义指令等指令将用户输入持久化到你的范围。如果您不希望将指令中的更改发布到其父模型中，那么您将不得不将其保留在其自己的隔离范围中，然后在需要时将更改推送出去。

Answer 2

我最终成功解决了这个问题。虽然试图在这里发布问题的演示，但我意识到由于我的代码结构，这将是不可能的。所以，我已经开始了一个重构过程，并确保一切都是“Angular方式”。这大大改善了我的代码结构，感觉好多了。它也无意中解决了我的问题，而我实际上并不知道修复了什么！

AngularJS：防止模型更改的视图更新

2 个答案: