Question

我正在尝试连接一个ui.bootstrap.modal对象来显示一些数据，我决定创建一个单独的html文件来保存模态的所有标记。我可以看到一些模态尝试打开，因为屏幕显示为灰色。但是，在控制台中我可以看到我收到404错误，但不是我打算用于我的模板的文件。

编辑 - 我可能已经解决了我的问题。在这个模块的配置级别，我添加了ui.bootstrap.modal。将其更改为ui.bootstrap后，一切正常。

唯一的问题是我的模态显示在屏幕的左上角？

打开模态的代码：

function openModal() {
 $uibModal.open({
 templateUrl: '../Pages/Views/Templates/emailListingView.html',
 controller: function ($scope) { }
 });
};

我的HTML模板：

<div>
<div class="modal-header">
    <h3 class="modal-title" id="modal-title">I'm a modal!</h3>
</div>
<div class="modal-body" id="modal-body">
    <ul>
        <li>Bruh</li>
    </ul>
</div>
<div class="modal-footer">
    <button class="btn btn-primary" type="button">OK</button>
    <button class="btn btn-warning" type="button">Cancel</button>
</div>

角度误差：

错误：$ compile：tpload 加载模板时出错

错误窗口：

无法加载资源：服务器响应状态为404（）https://localhost:44375/uib/template/modal/window.html

Answer 1

您需要确保并使用ui-bootstrap-tpls.min.js文件。这支持使用<script>模板。

AngularJS ui.bootstrap.modal templateUrl无法正常工作

1 个答案: