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来代替。