ASP.Net MVC3 プロジェクトのフロント エンドとして Angular (1.1.5) を使用していますが、ng-repeat の使用時にブラウザーでメモリ消費の問題が発生しています。
ルートが変更されて ng-view タグが更新されたときに、ng-repeat が使用されている場合、古い dom 要素はガベージ コレクションされないように見えます。
セットアップは次のとおりです。
- _layout.cshtml
<html ng-app="MyApp">、スクリプト、css、および angular アプリへのリンクを含むヘッダーを含むページ - レイアウト ページを使用した部分的な index.cshtml で、単一の
<ng-view></ng-view>タグが含まれています。 ng-repeat を含む私のコンテンツを含む index.html
index.html:
<div ng-controller="MyCtrl"> <div ng-repeat="item in items"> <p>Blah Foo Bar lorem ipsum gack</p> <hr /> </div> </div>ルーティング構成とコントローラーを備えたメイン アプリ モジュールを含む app.js
app.js
var app = angular.module('MyApp', ['MyApp.content'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.otherwise({ templateUrl: '/index.html' });
}]);
angular.module('MyApp.content', []);
angular.module('MyApp.content')
.controller("MyCtrl", ['$scope', function ($scope) {
$scope.items = [{}, {}];
}]);
そのため、ヘッダーのリンク (特定のルートが定義されていないため、常にルート変更が発生します) を繰り返しクリックしてからガベージ コレクターを呼び出すと、chrome タイムラインで次のように表示されます。
ご覧のとおり、メモリ ベースラインは初期値に戻らず、ルート変更が行われるほど増加し続けます。また、dom 要素の数も増え続けています。ヒープのスナップショットを見ると、これらは切り離されていますが、まだぶら下がっています。
ng-repeat を削除すると、dom カウントが各ルート変更をリセットします。
理由を知っている人はいますか？これらの要素がぶらぶらするのを防ぐにはどうすればよいですか?
更新: VS2010 で新しい MVC3 プロジェクトを作成しましたが、問題はありませんでした。VS2012 で新しい MVC3 プロジェクトを作成し、実行しました。:/