Attribut nicht in Angular Richtlinie Auswertung

Question

Ich bin verwirrt, warum die folgende Angular Richtlinie nicht funktioniert:

JS

angular 
    .module("app") 
    .directive("symbolImage", function() { 
     return { 
      restrict: 'AE', 
      scope: { 
       width: "@", 
       height: "@", 
       symbol: "@" 
      }, 
      template: "<div>{{width}} {{height}} {{symbol|json}}</div>", 
      replace: true 
     }; 
    }); 

VARIABLES

$scope.current = {prop1:{foo:"bar"}, prop2:{foo2:"bar2"}}; 
$scope.properties = ["prop1", "prop2"]; 

HTML

<tr ng-repeat="prop in properties"> 
    <td> 
     <symbol-image height="20" width="20" symbol="current[prop]"/> 
    </td> 
</tr> 

ERWARTETER AUSGANG UT (Erste Repeat)

20 20 {foo:"bar"} 

tatsächliche Ausgabe (Erste Repeat)

20 20 "current[prop.key]" 

Es ist (war) mein Verständnis der Werte zu Umfang bestanden bewertet werden, aber dies scheint nicht der Fall zu sein.

Alle/alle Hilfe ist willkommen.

Answer 1

Sie müssen nur

<symbol-image height="20" width="20" symbol="{{current[prop]}}"/> 

verwenden ‚@‘ erwartet Sie die Richtlinie eine Zeichenfolge zu geben. '=' erwartet, dass Sie der Anweisung ein Objekt zuweisen.

Eine weitere Möglichkeit, Problem zu lösen wäre Ihre Richtlinie so definieren waren:

 scope: { 
      width: "@", 
      height: "@", 
      symbol: "=" 
     }, 

Answer 2

sollten Sie Ihre Requisiten auf diese Weise

 scope: { 
      width: "@", 
      height: "@", 
      symbol: "=" 
     },