dart - 通过SignalR加载数据时重新绑定(bind)AngularDart中的页面

我有一个正在运行的AngularDart应用程序，但是我觉得我做错了...

该应用程序显示接收到的事件列表。这些事件通过SignalR到达应用程序，但我认为这并不重要-问题是我必须更新组件状态以查看状态变化显示在页面上的方式。

这是我组件的简化版本:

@Component( selector: 'liveEvents', templateUrl: 'live_events.html', useShadowDom: false )
class LiveEvents implements ScopeAware {
    VmTurnZone _vmTurnZone;
    EventReceiver _eventReceiver;
    LiveEvents( this._vmTurnZone, this._eventReceiver );
    List<Event> events = new List<Event>();
    void _onEventReceived(Event event) {
        //TODO: This just does not seem right...
        _vmTurnZone.run(() => events.add(event));
    }

    void set scope(Scope scope) {
        var _events = _eventReceiver.subscribeToAllEvents( "localhost", _onEventReceived );
    }
}

EventReceiver类负责连接到SignalR服务器，从该服务器接收消息并将它们转换为Event对象，然后调用subscribeToAllEvents中指定的任何函数(在本例中为_onEventReceived)

Angular 模板html非常简单:

<ul>
    <li ng-repeat="event in events">Event: {{event.Id}}</li>
</ul>

一切正常，但是我不喜欢的一点是必须将VmTurnZone对象注入(inject)组件，并且必须在对该run的VmTurnZone调用中更新events属性。对我来说似乎有点太复杂了。但是，如果我不使用VmTurnZone.run方法执行此操作，则当events属性更新时， View 不会更新以反射(reflect)该更改。仅在VmTurnZone.run内部有效。

有没有更简单的方法可以在这里完成我的工作？我已经看过在范围内添加手表，但是似乎没有用(在我看来，它应该用于发生其他方式的更改-即， View 会更新范围，而您想要在发生这种情况时做一些事情)。

AngularDart的专家可以让我知道是否有更好的方法来做我要做的事情吗？

最佳答案

https://api.dartlang.org/apidocs/channels/stable/dartdoc-viewer/dart:async.Stream

您可以将事件添加到流中，然后侦听这些事件，而signaler将看到这些更改，例如:

@Component( selector: 'liveEvents', templateUrl: 'live_events.html', useShadowDom: false )
class LiveEvents implements ScopeAware {
    EventReceiver _eventReceiver;
    LiveEvents( this._eventReceiver );
    List<Event> events = new List<Event>();

    void set scope(Scope scope) {
        subscribe().listen((event){
            events.add(event);
        });
    }

    Stream<Event> subscribe(){
        var streamController = new StreamController<Event>();

        _eventReceiver.subscribeToAllEvents( "localhost", (event){
            streamController.add(event);
        });

        return streamController.stream;
    }
}