accesso variabile scope dinamico $ all'interno html

Question

Sto creando una grande quantità di direttive e tutto sarà includere variabili scope dinamico che sarà inizializzato all'interno delle funzioni di collegamento esempio:

// 
link: function(scope, ele, attr){ 
    scope.key = scope.somevar + 'something_else'; 
    scope[scope.key] = 'the_value'; 
} 
// 

voglio accedere il valore nei modelli delle direttive tramite scope.key.

<div ng-if="scope[key]"> something </div> 

Attualmente vedo solo fosse stato fattibile attraverso una chiamata di funzione in questo modo:

html

<div ng-if="scope(key)"> something </div> 

js

scope.scope = function(key) { 
    return scope[key]; 
} 

Ma allora il problema è Avrò bisogno di t o copia questo in tutte le direttive.

Un'altra opzione che ho preso in considerazione è stata quella di assegnare la funzione getter allo $rootScope rendendola accessibile a livello globale, ma come collegarla o passare nell'ambito delle direttive attuali. (Se possibile anche).

Quale sarebbe un buon approccio a questo?

Answer 1

Dentro del modello angolare this punti chiave per il contesto di valutazione corrente, ovvero ambito corrente. Ciò significa che si sarebbe in grado di realizzare ciò che si sta dopo utilizzando la notazione staffa sull'oggetto this:

<div ng-if="this[key]"> something </div> 

Answer 2

Sarebbe più facile per vedere tutto il codice, ma suona come si può solo creare una funzione sul vostro scopo di recuperare il valore:

scope.getValue = function() { 
    return scope[scope.key]; 
} 

Poi, nel tuo HTML:

<div ng-if="getValue()"> something </div> 

Answer 3

Usa bindToController opzione nel tuo direttiva

JS

bindToController: true, 
controller: 'MyController', 
controllerAs: 'ctrl', 
link: function(scope, ele, attr){ 
    scope.ctrl.key = scope.somevar + 'something_else'; 
    scope.ctrl[scope.ctrl.key] = 'the_value'; 
} 

HTML

<div ng-if="ctrl[ctrl.key]"> something </div> 

Controllare questa codepen come esempio: http://goo.gl/SMq2Cx