角度Dart组件事件 [英] Angular Dart component events

问题描述

我尝试将自定义事件从组件传递到其父组件/控制器

I am trying to pass custom events from a component to its parent component/controller

confirm.html

confirm.html

<div class="comfirm-component">
    <content></content>
    <a href="#" ng-click="ctrl.yes()">Yes</a>
    <a href="#" ng-click="ctrl.no()">No</a>
</div>

confirm.dart

confirm.dart

@Component(
    selector: "confirm-component",
    templateUrl: 'confirm.html',
    useShadowDom: false,
    publishAs: "ctrl"
)
class ConfirmComponent {
    void yes(){
        print('yes');
        // Fire confirm-yes event
    }

    void no(){
        print('no');
        // Fire confirm-no event
    }
}

是否有这样的东西：

<confirm-component on-confirm-yes="doSomething()" on-confirm-no="doSomethingElse()">
    Do you want to delete
</confirm-component>

我可以使用一个普通的StreamController，但是我不得不连接我的组件与代码。 p>

I could use a normal StreamController but then i'd had to connect my components with code.

confirmComponent.onConfirmYes.listen()
confirmComponent.onConfirmNo.listen()

我也发现这个：
如何在Angular DART控制器之间进行通信

并且：
angulardart组件 - 调度自定义事件

在两个版本中，提到了scope.emit。但我没有找到一种方法使用它与组件而不是控制器。有没有一个完整的例子vor angular.dart v0.14.0？

In both treads scope.emit is mentioned. But i didn't find a way to use it with a component instead of a controller. Is there a full example vor angular.dart v0.14.0?

是scope.emit我正在寻找的东西？

Is scope.emit the thing i'm searching for?

推荐答案

这应该是一样的，只是添加一个范围参数到构造函数，所以组件获取范围注入。

This should be the same, just add a scope argument to the constructor so the component gets the scope injected.

Angular 0.14.0有一个相关变化 https://github.com/angular/angular.dart/commit/181f01448555c475869505491159045904e5dc89

There was a related change in Angular 0.14.0 https://github.com/angular/angular.dart/commit/181f01448555c475869505491159045904e5dc89

我还没有尝试过。
从描述中你需要实现 ScopeAware

@Component(...)
class MyComponent implements ScopeAware {
  Watch watch;
  MyComponent(Dependency myDep) {
    // It is an error to add a Scope / RootScope argument to the ctor and will result in a DI
    // circular dependency error - the scope is never accessible in the class constructor
  }

  void set scope(Scope scope) {
     // with this scope you should be able to use emit
     // This setter gets called to initialize the scope
     watch = scope.rootScope.watch("expression", (v, p) => ...);
  }
}

这篇关于角度Dart组件事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！