zagnieżdżony kontroler angularjs: jak jeden kontroler może komunikować się z innym kontrolerem? - angularjs, angularjs-scope

Oto mój widok HTML:

<div id="chatContainer">
<div id="users" ng-controller="usersController">
<div ng-repeat="user in users" class="userItem">{{user.username}}</div>
</div>

<div id="chatText" ng-controller="chatTextController">
<div ng-repeat="text in texts" class="text">{{text.text}}</div>
</div>

<div id="chatInput" ng-controller="chatInputController">
<input type="text" placeholder="Enter chat text here" id="chatInputTxt" ng-model="chatInputTxt">
</div>
</div>

Moim celem jest napisanie kontrolera chatInputController, więc gdy użytkownik wpisze w chatInputTxt, teksty w chatTextController są aktualizowane, mówiąc inaczej:

W jaki sposób chatInputController może uzyskiwać dostęp / komunikować się z chatTextController?

pozdrowienia

Odpowiedzi:

Nie powinieneś używać $emit lub $broadcast zawsze, gdy jest to możliwe, ponieważ im więcej usług tego wymaga, tym więcej problemów można rozwiązać.

Zagnieżdżone kontrolery w Angular.js automatycznie otrzymują kopię zakresu swoich rodziców. Aby odpowiedzieć na twoje pytanie, wszystko jest automatyczne.

<div ng-controller="controller1">
{{mySharedValue}} // bar
<div ng-controller="controller2">
{{mySharedValue }} // also bar
</div>
</div>

JS ...

function controller1($scope) { $scope.mySharedValue = foo; $scope.notify = function() {
console.log("I"m notified!")
}; }
function controller2($scope) { $scope.mySharedValue = bar; $scope.notify(); // logs "i"m notified!" }

Masz kilka opcji:

1. Możesz użyć $broadcast i $on komunikować się z kontrolerami rodzeństwa
2. Masz kontroler nadrzędny, możesz ustawiać obiektyna tym kontrolerze, który ma być współdzielony z kontrolerami potomnymi (po prostu upewnij się, że rozumiesz dziedziczenie zakresu Angular $, bo inaczej sprawy szybko się pogmatwają). - https://github.com/angular/angular.js/wiki/Understanding-Scopes
3. Użyj wspólnej usługi, aby uzyskać dostęp z każdego kontrolera

Możesz użyć $ emit lub $ broadcast do wygenerowania zdarzenia i przekazania niektórych danych.

• $ broadcast - wyślij zdarzenie w dół do wszystkich zakresów potomnych.

• $ emit - wyślij zdarzenie w górę poprzez hierarchię zasięgu.

  $ scope. $ broadcast („eventName”, param1, param2);

  Abyś mógł nadawać z $ rootScope. Następnie użyj drugiego kontrolera

  $ scope. $ on („eventName”, funkcja (param1, param2) { })

  złapać wydarzenie.

Możesz także skorzystać z usługi i skonfigurować zegarekusługa w każdym z twoich kontrolerów. Lub możesz mieć kontroler nadrzędny zamiast zanieczyszczać rootScope i wykonać transmisję z kontrolera nadrzędnego.

Jeśli komunikacja jest tylko jednym sposobem, od zakresu potomnego do zakresu macierzystego, wówczas emisja będzie działać z kontrolera potomnego.