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',
});
};
我正在使用 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',
});
};