Question

我试图创建一个非常简单的模态定义为：

var modelTemplate = '<div class="modal-header"><h3 class="modal-title">Test</h3></div><div class="modal-body">Selected</div><div class="modal-footer"></div>';

我将其显示为：

$scope.showAbout = function (){
    var modalInstance = $modal.open({template: modelTemplate});
}

但我收到以下错误：

XMLHttpRequest cannot load file:///home/noor/Documents/files/developlement/k7/android/WorldCup2014/template/modal/backdrop.html. Cross origin requests are only supported for HTTP. 
XMLHttpRequest cannot load file:///home/noor/Documents/files/developlement/k7/android/WorldCup2014/template/modal/window.html. Cross origin requests are only supported for HTTP. 
Error: [$compile:tpload] http://errors.angularjs.org/1.2.16/$compile/tpload?p0=template%2Fmodal%2Fbackdrop.html
Error: [$compile:tpload] http://errors.angularjs.org/1.2.16/$compile/tpload?p0=template%2Fmodal%2Fwindow.html

Answer 1

问题中没有足够的细节，所以我无法确定，但我认为你包含来自angular-ui / bootstrap发行版的错误文件。请记住，虽然分发了多个文件，但您只需要包含一个。要包含的确切文件取决于用例，但大多数时候要包含ui-bootstrap-tpls-[version].min.js。

此处描述了不同类型的分布式文件： https://github.com/angular-ui/bootstrap/tree/gh-pages#build-files

，此处提供安装说明： https://github.com/angular-ui/bootstrap#installation

简而言之 - 确保您包含带有嵌入模板的分发文件。如果在使用实时重现场景的情况下它仍然不起作用。

角度模态没有显示

1 个答案: