Come accedere alle funzioni del controller nel collegamento direttivo?

Question

Come accedere alle funzioni del controller di direttive dal collegamento direttiva? Il controller muggito passato al collegamento è vuoto, mi piacerebbe entrare in esso show() funzioni hide().

Il mio attuale direttiva:

app.directive('showLoading', function() { 
    return { 
    restrict: 'A', 
    // require: 'ngModel', 
    scope: { 
     loading: '=showLoading' 
    }, 
    controller: function($scope, $element) { 
     return { 
     show: function() { 
      alert("show"); 
     }, 
     hide: function() { 
      alert("hide"); 
     } 
     }; 
    }, 
    link: function($scope, $element, $attrs, controller) { 
     $scope.$watch('loading', function(bool) { 
     if (bool) { 
      controller.show();//undefined 
     } else { 
      controller.hide(); 
     } 
     }); 
    } 
    }; 
}); 

Answer 1

Publishing sulla portata può funzionare, ma non la migliore pratica, dal momento che "inquina" l'ambito. Il modo corretto di comunicare con il proprio controller è require - quindi diventerà disponibile come parametro per la funzione link, insieme ad altre direttive richieste.

L'altro problema riguarda il modo in cui si espongono le funzioni sul controller, utilizzando this.someFn, non restituendo un oggetto.

app.directive('showLoading', function() { 
    return { 
    restrict: 'A', 
    require: ['ngModel', 'showLoading'], // multiple "requires" for illustration 
    scope: { 
     loading: '=showLoading' 
    }, 
    controller: function($scope, $element) { 
     this.show = function() { 
     alert("show"); 
     }; 

     this.hide = function() { 
     alert("hide"); 
     }; 
    }, 
    link: function($scope, $element, $attrs, ctrls) { 
     var ngModel = ctrls[0], me = ctrls[1]; 

     $scope.$watch('loading', function(bool) { 
     if (bool) { 
      me.show(); 
     } else { 
      me.hide(); 
     } 
     }); 
    } 
    }; 
}); 

Answer 2

Hai qualche tipo di problema all'interno della funzione di controllo

Ecco il codice funzionando benissimo

app.directive('showLoading', function() { 
    return { 
    restrict: 'AE', 
    // require: 'ngModel', 
    scope: { 
     loading: '=showLoading' 
    }, 
    controller: function($scope, $element) { 
     $scope.show = function() { 
      alert("show"); 
     }, 
     $scope.hide = function() { 
      alert("hide"); 
     } 
    }, 
    link: function($scope, $element, $attrs) { 
     $scope.$watch('loading', function(bool) { 
     if (bool) { 
      $scope.show();//undefined 
     } else { 
      $scope.hide(); 
     } 
     }); 
    } 
    }; 
});