AngularJS Direktiven - Verknüpfen von Attributwert mit Bereichseigenschaft

Question

Ich verwende angular-nvd3 zum Chartieren in meiner Anwendung. Ich habe eine benutzerdefinierte Direktive erstellt, um die Optionen der Direktive zu übergeben, anstatt sie im Controller zu setzen.

Ausblick:

<nvd3-bar-chart></nvd3-bar-chart> 

Richtlinie

angular.module('app.graphs') 
    .directive('nvd3BarChart', 
     function() { 
      return { 
       restrict: 'E', 
       replace: true, 
       template: '<nvd3 options="nvd3_options" data="bar_data" api="api"></nvd3>', 
       link: function(scope) { 
        scope.nvd3_options = { 
         chart: { 
          type: 'discreteBarChart',.... 

Die bar_data Eigenschaft wird in der Steuerung gesetzt und das Diagramm funktioniert gut. Ich möchte jedoch die Direktive wiederverwenden, um an verschiedene Dateneigenschaften im Controller zu binden.

So etwas wie das. Verknüpfen der Datenattribut auf dem benutzerdefinierten Richtlinie über die Vorlage im Wesentlichen

//Temperature data would be set in controller 
<nvd3-bar-chart data="temperature_data"></nvd3-bar-chart> 

//Precipitation data would be set in controller 
<nvd3-bar-chart data="precipitation_data"></nvd3-bar-chart> 

Dank

Answer 1

ich dies durch die Angabe mit der Lösung am Ende der Attribut direkt auf der benutzerdefinierten Richtlinie

Wenn eckig das Direktiven-Markup durch das Template-Markup ersetzt, fügt es der ersetzten HTML-Zeile alle Attribute hinzu.

Answer 2

scope: { 
dataParam: '@' 
}, 
template: '<nvd3 options="nvd3_options" data="{{dataParam}}" api="api"></nvd3>', 

ohne Isolat Umfang in der Richtlinie:

template: '<nvd3 options="nvd3_options" data="{{dataParam}}" api="api"></nvd3>', 
link: function (scope, element, attr) { 
    scope.dataParam = attr.dataParam; 
}