BootstrapDialog 和 angularJS 包括 html

BootstrapDialog and angularJS including html

我正在使用 https://github.com/nakupanda/bootstrap3-dialog 在我的网络应用程序上显示对话框。

$scope.importFileWithSettings = function(){
                BootstrapDialog.show({
                        type: BootstrapDialog.TYPE_INFO,
                        message: "<div ng-include=\"'importform.html'\"></div>",
                        title: 'Title',
                });
            }; 

importform.html 在同一目录中。当对话框显示时,它不显示 importform.html 内容。如何正确操作(我对 angularJS 和 bootsrap 比较陌生)?

您可以使用 angularjs 的脚本组件,这是包含模板的最佳方式...

<script type="text/ng-template" id="exampleTemplateId">
   Content of the template.
</script>

然后在你的 ng-include 指令中使用它和它的 id

<div ng-include=\"'exampleTemplateId'\"></div>

更多详情请查看docs

更新

您可以使用 angularjs 的 $templateCache 服务来达到这个目的...

在您的 run 区块中,您可以像这样使用此服务

var myApp = angular.module('myApp', []);
myApp.run(function($templateCache) {
  $templateCache.put('exampleTemplateId', 'This is the content of the template');
}); 

并再次在 ng-inlucde 中使用它,如上所述

根据文档,这应该有效:

$scope.importFileWithSettings = function(){
    BootstrapDialog.show({
            type: BootstrapDialog.TYPE_INFO,
            message: "$('<div></div>').load('importform.html')",
            title: 'Title',
    });
};