ng-template zu Variable von src

Question

Ich möchte den Inhalt meiner Vorlage in eine Variable laden. Im Moment sieht mein Code so aus.

HTML

<script type="text/ng-template" id="a.html" src="templates/a.html"></script> 

JS

vm.template = $templateCache.get('a.html'); 
console.log("Template: " + vm.template); 

Dies sollte den Inhalt von 'templates/a.html' Laden in vm.template. Leider funktioniert das nicht. Die Variable vm.template enthält die Vorlage nicht.

Was ich herausgefunden habe beim Testen das ist, wenn ich den Inhalt der Vorlage schreiben direkt in die Script-Tags wie diese

<script type="text/ng-template" id="a.html">Hello!</script> 

Es tatsächlich funktioniert.

Answer 1

Verwendung src auf ng-Vorlage kann nicht funktionieren:

Sie entweder einen können ng-umfassen:

<script type="text/ng-template" id="a.html"> 
    <div ng-include="'templates/a.html'"></div> 
</script> 

oder diese config in die Routing tun:

.config(function ($routeProvider) { 
    $routeProvider 
     .when("/", { 
      templateUrl: 'templates/a.html', 
      controller: 'aController' 
     }).when("/second", { 
      templateUrl: 'templates/b.html', 
      controller: 'bController' 
     }).otherwise({redirectTo: "/"}); 
}); 

Auch dies tut eine /templates/a.html GET Anfrage an Ihren Server (Stellen Sie sicher, dass Ihre Statik konfiguriert)

Answer 2

Sie Direktive verwenden:

.directive('script', function() { 
    return { 
     restrict:'E', 
     scope: false, 
     controller: function($attrs, $templateCache, $http, $log) { 
     if($attrs['type'] != "text/ng-template" || !$attrs['src']){ 
      return; 
     } 

     var id = $attrs['id'] || $attrs['src']; 
     var src = $attrs['src']; 
     $log.debug('Loading %s template from %s', id, src); 

     $http.get(src).then(function(response){ 
      $log.debug('Loaded template %s', id); 
      $templateCache.put(id, response.data); 
     }); 
     } 
    }; 
    })