AngularJS ui.bootstrap.modal templateUrlが正しく動作しない

Question

私はui.bootstrap.modalオブジェクトをワイヤリングしてデータを表示しようとしています。別のHTMLファイルを作成して、すべてのマークアップを保持することにしました。画面が灰色で表示されるため、いくつかのモーダルが開こうとしています。しかし、コンソールでは私のテンプレートに使用しようとしていたファイルではありませんが、404エラーが発生することがわかりました。

EDIT - 私の問題を解決した可能性があります。このモジュールの設定レベルで、私は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> 

角度誤差：

Error: $compile:tpload Error Loading Template

エラーウィンドウ：

Failed to load resource: the server responded with a status of 404() https://localhost:44375/uib/template/modal/window.html

Answer 1

ui-bootstrap-tpls.min.jsファイルを確認して使用する必要があります。これは、<script>テンプレートの使用をサポートしています。