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>×</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 코드가 다른 경로의 단일 파일로 연결되며 $ templateCache를 통해로드가 중단됩니다. 이제 모든 templateUrl을 절대적으로 만드는 것이 해결책이지만, 상대적인 templateUrl을 사용하는 플러그인에 대해서는 코드를 변경하지 않고 할 수 없습니다.
그래서 아무도 나에게 실제로 무슨 일이 일어나고 있는지, 그리고 플러그인 코드를 건드리지 않고이 문제를 어떻게 해결할 수 있는지 설명 할 수 있습니까?
이<script type="text/javascript">
window.contextPath = "${request.contextPath}";
</script>
이 응용 프로그램이 끊어하는 생산에 번들로 제공되는 window.contextPath
을 설정
동일한 문제가 있습니다. 당신이 해결했는지 말해주세요. AngularJS에 Videogular를 사용하고 있으며 $ templateCache를 사용하여 캐시에 템플릿을 저장하지만 실제로 404 오류를 발생시키는 지시문에로드되지 않습니다. ( – l1fe
방금 내 솔루션을 게시했습니다 ...이 도구가 도움이 될 수 있기를 바랍니다 .. . – Tobson