How to communicate between Angular DART controllers

4
votes

i have two controllers and want to "send" between them object. I have something like this:

@NgController(selector: '[users]', publishAs: 'ctrl')
class UsersController {
  List<Users> users;
}

@NgController(selector: '[user_logs]', publishAs: 'ctrl')
class LogsController {
  List<Log> logs;
  void filterLogsFor(User user) { logs = ... }
}

class MyAppModule extends Module {
  MyAppModule() {
    type(LogsController);
    type(UserController);
  }
}

My solution was simply adding LogsController to UserController as dependency and calling something like ctrl.logsCtrl.filterLogsFor(user) from template. But it won't work for some reason - i found out DI create another new object LogController which is not related to template itself - i even tried change to "value(LogsController, new LogsController())", but its same - it creates new LogsController when new MyAppModule called and then new another one for template i guess. I am clearly doing something wrong - but documentation is not helpful and angularjs seems not similar at all.

UPDATE: Imagine two tables(controlers) - users and logs, every user row have link to show logs assigned to him.

3
dartangular-dart

3 Answers

9
votes

With the newest AngularDart library (0.10.0), Günter Zöchbauer's solution is still correct, but the syntax has changed a bit:

// Receiver
//import 'dart:async';
String name;
Scope scope;
ReceiverConstructor(this.scope) {
  Stream mystream = scope.on('username-change');
  mystream.listen(myCallback);
}

void myCallback(ScopeEvent e) {
  this.name = e.data;
}


// Sender
scope.emit("username-change", "emit");
scope.broadcast("username-change", "broadcast");
scope.parentScope.broadcast("username-change", "parent-broadcast");
scope.rootScope.broadcast("username-change", "root-broadcast");
8
votes

You could use
* scope.$emit
* scope.$broadcast
* scope.$on

@grohjy s solution might work also, depending on your requirements

Scope scope;
UserController(this.scope) { // get access to the scope by adding it to the constructor parameter list
  // sender
  scope.$emit('my-event-name', [someData, someOtherData]); // propagate towards root
  scope.$broadcast('my-event-name', [someData, someOtherData]); // propagate towards leaf nodes (children)
  scope.$parent.$broadcast('my-event-name', [someData, someOtherData]); // send to parents childs (includes silblings children)
  scope.$root.$broadcast('my-event-name', [someData, someOtherData]); // propagate towards leaf nodes starting from root (all nodes)

  // receiver
  scope.$on('my-event-name', (ScopeEvent e) => myCallback(e)); // call myCallback when an `my-event-name` event reaches me
}

just write scope.$emit (or one of the other methods) and ctrl+mouseclick to navigate to the the doc comments to get more information.

1
votes

I don't fully follow your question, could you include the whole code for better understanding.

Here is one example, which might answer to your question: https://github.com/angular/angular.dart/issues/264