AngularJS：防止從模型更改的視圖更新

我有一個指令widget，其中許多動態添加到頁面到三個垂直列之一。在指令中，我通過parent屬性跟蹤widget所在的列。我用呈現此是作爲HTML如下：AngularJS：防止從模型更改的視圖更新

<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放在一起，說明如果使用該問題，我將擁有該問題。

來源

2013-02-26 jwest

JSFiddle肯定會有用。我以前有過類似的拖放設置，並且每次都不重新初始化數據。 – 2013-02-26 14:29:22

試圖把現在放在一起 - 謝謝。只是出於興趣，你用什麼來拖放？我正在使用jQuery UI。 – jwest 2013-02-26 17:09:33

不幸的是，我沒有直接處理它，只是間接的，但我相信我們也使用jQuery-UI。 – 2013-02-27 15:24:44

我終於設法解決了這個問題。在嘗試敲出問題的演示文稿發佈到此處時，我意識到由於我的代碼結構，這是不可能的。所以，我開始了一個重構的過程，並確保一切都是'角度的方式'。這極大地改進了我的代碼結構，感覺好多了。它也無意中解決了我的問題，但我實際上並不知道解決了什麼問題！

來源

2013-03-04 09:16:26 jwest

我們可能需要查看該widget指令。

但是不看它，如果重新處理視圖消除了對小部件所做的更新，那麼這個小部件不是很「角」。

我的意思是說，你不應該在DOM中保留用戶輸入，你應該通過ngModel或甚至自定義指令等指令將用戶輸入保存到你的範圍。如果您不希望將指令中的更改發佈到其父模型中，則必須將其保存到它自己的隔離範圍中，然後在需要時將更改推送出去。

來源

2013-02-26 14:00:44

快速回答 - 謝謝。我相信我的問題正在發生，因爲我將數據綁定到單個列的方式，因爲這個小部件絕對是以'Angular'方式編寫的。我通過更改父指令來更改指令的DOM位置，並且我確信它會導致重繪。我不可能發佈我的整個代碼，因爲它有太多的方法，並且b）連接到內部Web服務。我會試着把一些東西放在一起來說明這個問題 – jwest 2013-02-26 14:07:48

AngularJS：防止從模型更改的視圖更新

回答

相關問題