AngularJS 지시어에서 데이터 프리 페치

Question

AngularJS에서 URL에서 데이터를 미리 가져올 수있는 방법이 있습니까? 템플리트 캐시에 대해 들었습니다. 템플릿 캐시가 내용을 경로에서로드 할 수 있습니까? 지시문을 만들었지 만 문제가 있습니다. 템플릿을 사용할 때 html을 미리로드하지만 templateURL을 사용할 때 html을 경로에서 미리로드하지 않고 필요할 때만로드합니다. 하지만 미리로드 할 데이터가 필요합니다. 그게 가능하니?

cmsApp.directive('ptnPopup', function() { 
    return { 
     restrict: 'E', 
     transclude: true, 
     controller: 'MainCtrl', 
     template: '<div>{{bid}}</div>', 
     //templateUrl: './template/popups/primary_trading_name.html', 
     link: function(scope, element, attrs) { 
      scope.bid = 5; 
     } 
    }; 
}); 

Answer 1

가장 쉬운 방법은 템플릿을 기반으로 템플릿 캐시를 생성하는 프로젝트에 작업을 도입하는 것입니다.

는 https://github.com/ericclemmons/grunt-angular-templates

처럼 그것은 본질적으로 $의 templatecache에 그들 모두를 미리로드 할 템플릿을 기반으로 JS 파일을 생성합니다. 이 js가로드되면 더 이상 템플릿에 대한 ajax 요청이 생성되지 않고 directive 정의에서 templateURL 구문을 계속 사용할 수 있습니다.

angular.module('app').run(["$templateCache", function($templateCache) { 
    $templateCache.put("home.html", 
    // contents for home.html ... 
); 
    ... 
    $templateCache.put("src/app/templates/button.html", 
    // contents for button.html 
); 
}]);