バンドル後の相対templateUrlsの角度$ templateCache 404エラー

Question

AngularJSプロファイルとともにGrails 3をAngular Toastr pluginとともに使用しています。
私は開発モードでアプリケーションを実行すると、すべてが完璧に動作しますが、私は（縮小なし）アプリをバンドルする場合、プラグインからのテンプレートはもうロードできないと、私は次のエラーを取得：

Error: [$compile:tpload] Failed to load template: directives/toast/toast.html (HTTP status: 404 Not Found) 

を私はラインバンドルされたコードをチェックした：それはそう

angular.module('toastr') 
    .constant('toastrConfig', { 
     allowHtml: false, 
     autoDismiss: false, 
     closeButton: false, 
     closeHtml: '<button>&times;</button>', 
     containerId: 'toast-container', 
     extendedTimeOut: 1000, 
     iconClasses: { 
     error: 'toast-error', 
     info: 'toast-info', 
     success: 'toast-success', 
     warning: 'toast-warning' 
     }, 
     maxOpened: 0, 
     messageClass: 'toast-message', 
     newestOnTop: true, 
     onHidden: null, 
     onShown: null, 
     onTap: null, 
     positionClass: 'toast-top-right', 
     preventDuplicates: false, 
     preventOpenDuplicates: false, 
     progressBar: false, 
     tapToDismiss: true, 
     target: 'body', 
     templates: { 
     toast: 'directives/toast/toast.html', 
     progressbar: 'directives/progressbar/progressbar.html' 
     }, 
     timeOut: 5000, 
     titleClass: 'toast-title', 
     toastClass: 'toast' 
    }); 

と

angular.module("toastr").run(["$templateCache", function($templateCache) {$templateCache.put("directives/progressbar/progressbar.html","<div class=\"toast-progress\"></div>\n"); 
$templateCache.put("directives/toast/toast.html","<div class=\"{{toastClass}} {{toastType}}\" ng-click=\"tapToast()\">\n <div ng-switch on=\"allowHtml\">\n <div ng-switch-default ng-if=\"title\" class=\"{{titleClass}}\" aria-label=\"{{title}}\">{{title}}</div>\n <div ng-switch-default class=\"{{messageClass}}\" aria-label=\"{{message}}\">{{message}}</div>\n <div ng-switch-when=\"true\" ng-if=\"title\" class=\"{{titleClass}}\" ng-bind-html=\"title\"></div>\n <div ng-switch-when=\"true\" class=\"{{messageClass}}\" ng-bind-html=\"message\"></div>\n </div>\n <progress-bar ng-if=\"progressBar\"></progress-bar>\n</div>\n");}]); 

をそのテンプレートAテンプレートキャッシュで正しく初期化されます。

コントローラに$ templateCacheを注入しようとしましたが、これは$templateCache.get("directives/toast/toast.html")と呼ばれ、正しいテンプレートが返されます。

$templateCache.get(...)でアクセスできますが、テンプレートが正しくバンドルされていないのはなぜですか？
$ templateCacheの正しい使い方について私が見逃していることはありますか？

PS：私はどのように相対的な、私は絶対templateUrlsを使用する場合、私は、すべてが動作すること、がわかったので、どうやら、私は完全には理解していない編集角度、ブートストラップテンプレート

ために同じ問題を指摘templateUrlsは動作します。
アプリケーションがバンドルされると、すべてのJSコードが異なるパスの1つのファイルに連結されます。これは、$ templateCache経由でロードを中断するようです。さて、すべてのtemplateUrlを絶対的にすることは解決策ですが、相対的なtemplateUrlを使用するプラグインでは、コードを変更せずに行うことはできません。

ここで実際に何が起きているのか、プラグインコードに触れることなくこの問題を解決する方法を教えていただけますか？

が

<script type="text/javascript"> 
    window.contextPath = "${request.contextPath}"; 
</script> 

これはアプリが壊れた生産のためにバンドルされてwindow.contextPathを設定します。

Answer 1

私は角度のためにGrailsのアプリを生成するとき、それは自動的にindex.gspに次の行が含まれていること、が分かりました角度$のtemplateCache。

つまり、window.contextPath = ""に設定されているか、$ templateCacheのテンプレート解決が失敗します。