Prerender Angular UI Modal

Question

我正在使用Anuglar UI Bootstrap Modal打開AngularJs對話框，並在第一次打開模式時遇到性能問題。當對話框出現時，會有明顯的口吃以及頁面上某些隱藏元素的閃爍。隨後所有模式都會打開對話框，而不會出現任何口吃。

我認爲這是由於編譯視圖的一次性計算開銷。有什麼方法可以在我的應用程序的背景中預編譯模態，以便用戶打開對話框時就可以開始了。

我使用的角度UI莫代爾服務，像這樣

$uibModal.open({ 
    templateUrl:'my-modal.html', 
    controller:'MyModalCtrl' 
}); 

我想是這樣的指令，但我需要的東西，會在控制器/對話工作。

var directive = $compile("<my-directive></my-directive>"); 
var instance = directive(scope.$new(true)); 

我使用的角度1.5.8和角度的UI，引導1.3 這個問題在所有瀏覽器和桌面和移動顯示出來，但它在低功率硬件最顯着的（手機，平板電腦）

https://embed.plnkr.co/hDM6GrUh8droo988MOox/

Answer 1

使用解決方案確保在打開模式之前數據已準備就緒。

下面是一個來自文檔的示例。

var modalInstance = $uibModal.open({ 
     animation: $ctrl.animationsEnabled, 
     ariaLabelledBy: 'modal-title', 
     ariaDescribedBy: 'modal-body', 
     templateUrl: 'myModalContent.html', 
     controller: 'ModalInstanceCtrl', 
     controllerAs: '$ctrl', 
     size: size, 
     resolve: { 
     items: function() { 
      return $ctrl.items; 
     } 
     } 
    }); 

另外，遠離{{}}模式（如果這就是你使用的）並使用ng-bind來代替。