Wie beobachte ich mehrere interpolierte Attribute in einer Direktive?

Question

Ich verstehe nicht, wie mehrere Attribute gleichzeitig in der Link-Funktion zu sehen, so dass ich ein Objekt mit allen Parametern erstellen und ich darauf achten. Aber ich habe festgestellt, dass das Attribut in der Verknüpfungsfunktion eine Zeichenfolge und kein Objekt ist, also verwende ich angular.fromJson (val).

All the example I found just use one parameter

Können Sie uns erklären, wie mehrere Attribute zu sehen?

Dank

EDIT: I attrs Parameter nicht verwenden können, weil ich die Attribute binden müssen - das heißt, sie benötigen Interpolation. Zum Beispiel

<ul class="thumbnails"> 
    <li class="span3" ng-repeat="image in currentSizeInfo.images" > 
     <upload-file info = "{{getInfo($index)}}" foo="foo$index" ></upload-file> 
    </li> 
</ul> 

Ich denke, dass ich $

link:function (scope, element, attrs) { 
    scope.$watch('info', function (val) { 
    // if info is and foo is .... do all the stuff 
    }) 
} 

Answer 1

Ich bin nicht sicher, ich Ihre Frage verwenden beobachten verstehen, so bitte korrigieren Sie mich, wenn ich falsch verstehen. Möchten Sie nur Werte aus mehreren Attributen Ihrer Anweisung ziehen? Also sagen Sie, Sie haben ein HTML wie folgt:

<my-directive attr1="data1" attr2="data2" attr3="data3" /> 

Und Sie möchten die Werte dieser verschiedenen Attribute erhalten? In der Link-Funktion verwenden Sie einfach den Parameter attrs. Beispiel:

Sie können auch die Eigenschaft scope für die Direktive verwenden, um Attribute automatisch an Ihren Bereich zu binden. Siehe their documentation zu Direktiven. So etwas in der Art:

scope: { 
    attr1: '@', 
    attr2: '@', 
    attr3: '@' 
} 

Und dann diese Eigenschaften enden automatisch in Ihrem Bereich. Jedoch, as I found out, diese Werte sind nicht immer im Rahmen, wenn Sie erwarten würden. So können Sie die $watch Funktion verwenden, um zu tun, was Sie mit ihnen benötigen. Etwas wie:

link: function(scope, element, attrs) { 
    scope.$watch("attr1", function() { 
     if (scope.attr1) 
     { 
       //stuff with attr1 
     } 
    } 
    scope.$watch("attr2", function() { 
     if (scope.attr2) 
     { 
       //stuff with attr2 
     } 
    } 
    //.... 
} 

Wenn Sie sie alle zusammen in der gleichen Zeit verwenden, können Sie eine Funktion für den ersten Parameter des $watch verwenden könnte, die einen String zurückgibt, die anders sein würde, wenn sie alle da sind und dann Setzen Sie Ihre Logik in die Funktion, die der 2. Parameter ist. So etwas wie folgt aus:

link: function(scope, element, attrs) { 
    scope.$watch(function() { 
     if (scope.attr1 && scope.attr2 && scope.attr3) 
     { 
      return "allSet"; 
     } 
     else 
     { 
      return ""; 
     } 
    }, function (newVal) { 
     if ("allSet" == newVal) 
     { 
      //do stuff with all the properties 
     } 
    }); 
} 

Wenn Sie wollen Objekte in Ihrem Umfang binden, können Sie ‚=‘ statt ‚@‘ ist. Eine andere Option ist '&', die eine Funktion im übergeordneten Bereich auswertet. Dies alles wird in der oben verlinkten Richtlinie erläutert.