Could ObservableEvent return a Subject?

[fxck]

The thing is, you sometimes want to trigger the event from both template and your class, this would require a mix of ObservableEvent and a Subject. Or ObservableEvent could return Subject. Perhaps conditionally even?

Btw all your import paths in readme are wrong, missing the @typebytes part.

[fxck]

Otherwise, this is a great idea. 👍 Angular might take another year to do that cold observable thing.

[d3lm]

Oh good catch regarding the paths! I'll fix that ASAP.

Regarding the decorator, it doesn't return anything but sets the value of the decorated target, which in this case is the template stream property. And the only job of the decorator right now is to create the subject property __<streamName>$ at runtime (in non AOT mode) and assign the subject.asObservable() to the decorated property.

I see a couple of issues with introducing a configuration option for this, as that also needs to be reflected back to the template. And right now, there's no communication between the template engine and the decorator because those operate independently. The HTML transformation happens at build time and the decorator adds the subject at runtime. So even if we had an option that changes the value of the observable event property, then that would break the template.

As a "workaround" for now, until we figure out a proper solution to this, is to declare the observable event property with two underscores and type it as a Subject. This allows you to get access to the underlying subject and the decorator will set the value of the property. I know this is a bit hacky but maybe this works for now. For example:

@Component({...})
export class AppComponent implements OnInit {
  @ObservableEvent()
  clicks$: Observable<any>;
  
  // Will be defined at runtime and gives you access to the underlying 
  // source of `clicks$`. Just make sure not to initialize this with a value.
  __clicks$: Subject<any>;
}

Any ideas?

[d3lm]

Alright, import paths are fixed.

[fxck]

Assign either subject.asObservable() or subject to the decorated property depending on the configuration option?

[fxck]

Or introduce second decorator SubjectEvent?

[d3lm]

As mentioned in my comment earlier, this will be difficult because the HTML transformer and the transformer or the component class don't share state, and the HTML transformation assumes that there is a property __<event-stream-name> that holds the subject. This is used to broadcast events from the template.

For now I would suggest to simply define this property yourself on the class as you can see in my earlier code snippet.

Does that work for you?

In the meantime I'll think about how this could be achieved.

FYI: I am also adding two more decorators ObservableChild and ObservableChildren that both use fromEvent under the hood. This gives you a bit more flexibility and you can choose the operator that works best in your scenario. All of them have their use cases.

[d3lm]

But I am more than happy to look at a PR if you have an idea that works without introducing too much glue between the individual components. I would like to keep them decoupled as much as possible.