ng-include過於頻繁地被調用

我發現當我使用ng-include時，它會被調用太頻繁。ng-include過於頻繁地被調用

每次單擊Nothing按鈕之一或更改視圖，或者在輸入框中鍵入內容時，getView會多次運行。更改視圖時最多6次。基本上做任何改變$scope的東西都會生成getView的呼叫。

我創建了一個plunker顯示的行爲我描述：plnkr.co

這是正常的行爲，有沒有什麼辦法讓它只運行一次？我擔心我會因此而失去表現。

我的代碼：

的index.html

<body ng-app="includeExample"> 
    <div ng-controller="ExampleController"> 
    <div class="row"> 
     <input type="text" ng-model="unrelated"> 
    </div> 
    <div class="row"> 
     <tabset> 
     <tab heading="View 1"> 
      <ng-include src="getView('template1')"></ng-include> 
     </tab> 
     <tab heading="View 2"> 
      <ng-include src="getView('template2')"></ng-include> 
     </tab> 
     </tabset> 
    </div> 
    </div> 
</body>

的script.js

angular.module('includeExample', ['ngAnimate', 'ui.bootstrap']) 
    .controller('ExampleController', ['$scope', 
    function($scope) { 
     $scope.getView = function(filename) { 
     console.log("getView " + new Date()); 
     return filename + ".html"; 
     }; 
    } 
    ]);

Template1.html

Content of template1.html 
<button type="button" class="btn btn-primary" ng-click="">Nothing</button>

來源

2014-07-16 NoClueBlue

是的，這是正常的。請參閱https://github.com/angular/angular.js/issues/1305 – runTarm

的gular每次運行摘要時都會調用您的getView方法，以確保值沒有改變。這是角度如何將模型和視圖綁定在一起的「魔術」的一部分。如果您查看開發工具的網絡選項卡，則會看到每次運行摘要時，模板實際上都不會被瀏覽器檢索到。知道這是摘要如何實際工作 - 你應該開發相應的代碼運行密集操作的方法是而不是直接綁定到視圖！

有關自身消化更多信息，請參閱：

http://angular-tips.com/blog/2013/08/watch-how-the-apply-runs-a-digest/
https://docs.angularjs.org/guide/scope（搜索「範圍的生命週期」）
https://www.ng-book.com/p/The-Digest-Loop-and-apply/

希望幫助！

來源

2014-07-16 14:13:24

是的，每次你做任何事時，angularJS都會經過getView()。一個好的第一次迭代是將它分配給一個json對象，而不是使用get方法。實際上，如果你不在HTML中使用任何get類型的方法，它會更好。然後如果你真的不想改變，你可以刪除2路綁定（Render value without data-binding）。

來源

2014-07-16 14:13:46

ng-include過於頻繁地被調用

回答

相關問題