Come utilizzare un controller per due direttive?

Ho questo codice:Come utilizzare un controller per due direttive?

JS:

angular.module("module") 
    .controller("fooController", ["$scope", function($scope) { 
    ... 
    }) 
    .directive("foo", function() { 
    return { 
     restrict: "E", 
     controller: "fooController", 
     link: function($scope, $element, $attrs) { 
     // Do some things with the scope of the controller here 
     } 
    } 
    }) 
    .directive("bar", function() { 
    return { 
     restrict: "E", 
     require: "fooController", 
     link: function($scope, $element, $attrs) { 
     // Nothing yet 
     } 
    } 
    });

HTML:

<html> 
    <head> 
    <!-- Scripts here --> 
    </head> 
    <body ng-app="module"> 
    <foo/> 
    <bar/> 
    </body> 
</html>

direttiva foo opere, ma la direttiva bar genera un errore: No controller: fooController.

Come posso risolvere questo problema mantenendo la mia struttura attuale (il controller non è all'interno dell'HTML, ma è utilizzato dalle direttive, bar è all'esterno dello foo e condivide lo stesso controller, mentre entrambi stanno modificando il suo ambito)? Ho letto la discussione here, ma non riuscivo a capire come farlo.

fonte

2013-06-05 tgkokk

Solo per curiosità, perché stai utilizzando lo stesso controller per entrambe le direttive? – callmekatootie

Ho bisogno di condividere alcuni dati tra di loro. Conosci un modo migliore per farlo? – tgkokk

Sì - Servizi! '$ rootScope' fa anche il trucco, ma sarà disapprovato. http://stackoverflow.com/questions/9293423/can-one-controller-call-another-in-angularjs - questo è tutto ciò che devi sapere per comunicare tra i controller. – callmekatootie

Poiché il vostro obiettivo finale è quello di comunicare tra i controller, non è necessario il riutilizzo dello stesso controller su più direttive (Dubito riutilizzare ti permetterebbe di comunicare). Ad ogni modo, il modo migliore per farlo sarebbe utilizzare i servizi.

articolo Can one controller call another? ne parla in dettaglio, ma in termini semplici, creare innanzitutto un servizio:

app.factory('myService', function() { 
    var data; 
    return { 
     getData: function() { 
      return data 
     }, 
     setData: function (newData) { 
      data = newData; 
     } 
    }; 
});

È quindi possibile utilizzare questo servizio nel vostro controller e comunicare con ogni controller utilizzando setData() e getData() funzioni di il servizio.

fonte

2013-06-05 09:09:14 callmekatootie

Non è possibile richiedere un controller. Puoi richiedere una direttiva che è uno dei genitori dell'attuale direttiva.

<foo> 
     <bar /> 
    </foo> 

    // in foo 
    controller: 'fooController' 
    // in bar 
    require: '^foo' //^means to search it up in the tree

Qui a barre può richiedere foo e avrete il controllore di foo: http://jsfiddle.net/Zmetser/kHdVX/ In questo esempio fooController'll essere inizializzato una volta.

<foo /> 
    <bar /> 

    // in foo 
    controller: 'fooController' 
    // in bar 
    controller: 'fooController'

Qui bar e foo ha la sua sulla istanza del fooController: http://jsfiddle.net/Zmetser/QypXn/

fonte

2013-06-05 09:03:00 Oliver

Ma sì, se le tue direttive sono fratelli, i servizi sono una soluzione. – Oliver

Buona soluzione e la userò sicuramente quando le direttive non devono essere fratelli. Per questo caso, callmekatootie è meglio IMHO. – tgkokk

Come utilizzare un controller per due direttive?

risposta

Problemi correlati