Comment assigner un ng-modèle à la directive champ templateURL

Question

Ceci est mon script ng-modèle:

<script type="text/ng-template" id="temp1.html"> 
     <div style="min-width: 320px; min-height: 213px; max-width: 320px; max-height: 213px"> 
      <p style="background-color:black; color:white; margin:20px; padding:20px;">A simple tempalate child</p> 
      <div style="background-color:gray; color:white;">Html contents also works ok!!!</div> 
      <div>The quick brown fox jumps over the lazy dog</div> 
      <p> 
      Make the fox 
      <button type="button" onclick="alert('Jump!!');">jump</button> 
      </p> 
     </div> 
    </script> 

Ceci est ma définition de la directive:

app.directive('mydiv', function(){ 
    return { 
    restrict: 'E', 
    templateUrl: "'temp1.html'", 

    } 
}); 

mais je reçois l'erreur suivante dans console:

Error: [$compile:tpload] http://errors.angularjs.org/1.2.21/$compile/tpload?p0='temp1.html' 
    at Error (native) 
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:6:450 
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:60:488 
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:72:132 
    at l.promise.then.w (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:100:39) 
    at l.promise.then.w (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:100:39) 
    at l.promise.then.w (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:100:39) 
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:101:295 
    at k.$get.k.$eval (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:111:373) 
    at k.$get.k.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js:108:462)(anonymous function) @ angular.js:10023$get @ angular.js:7327l.promise.then.w @ angular.js:11532l.promise.then.w @ angular.js:11529l.promise.then.w @ angular.js:11529(anonymous function) @ angular.js:11662$get.k.$eval @ angular.js:12632$get.k.$digest @ angular.js:12444$get.k.$apply @ angular.js:12736h @ angular.js:8339w @ angular.js:8553A.onreadystatechange @ angular.js:8492 

que je fais quelque chose de mal dans la façon dont je suis à mon ng-template assigne templateUrl attribut?

Answer 1

Remplacer:

templateUrl: "'temp1.html'", 

Avec:

templateUrl: "temp1.html", 

Vous n'avez pas besoin de ces citations supplémentaires dans une variable JS.

DEMO