Skip to content

Instantly share code, notes, and snippets.

@tomastrajan
Created October 20, 2022 21:38
Show Gist options
  • Save tomastrajan/f5a8b36ac9a02bdebedf66f9eea656e8 to your computer and use it in GitHub Desktop.
Save tomastrajan/f5a8b36ac9a02bdebedf66f9eea656e8 to your computer and use it in GitHub Desktop.
Angular DX syntax proposal - more decorators πŸ˜…
@Component({ /* ... */ })
export class SomeComponent {
// streamifies input
@Input$() prop: Observable<string>;
// lifecycle notifier as an Observable stream
@OnDestroy$() destroy$: Obseravble<void>;
// lifecycle hook as decorator instead of implements interface
@OnInit()
init() { // could be any method name when used with decorator
}
}
@DaSchTour
Copy link

Love this, I also use RxJS heavily and this would make my life oh so much easier.

If anyone would make it into a reality, how would you do it? For example handling initial values. Would you allow making the subject on your own have the decorator do it?

I'd come up with something like this from the top of my mind.

@BehaviorInput$('hello') foo$: BehaviorSubject<string>;
@ReplayInput$(1) bar$: ReplaySubject<string>;
@Input$() zed$: Subject<number>;

But what if I'd like some throttling on this input? I can't really have the user to define a full input pipeline, I'd need a separate reference to the source subject and the pipeline so I'd may settle with 1 decorator and an options object:

@Input$({
  initialValue: 'hello', // would make it create a BehaviorSubject
  replayCount: 1, // ignored if previous is defined
  throttleTime: 300, // Adds a throttleTime operator with `leading` and `trailing` emits set to true
}) foo$: BehaviorSubject<string>; // Sadly you'd have to type this up yourself depending on the option...

But this has conflicting configurations so in the end I'd probably have all three of them as separate decorators and then an additional options for pre-added operators. Maybe a 2nd parameter (initial: T, config: Config), or to replace the first one (config: T | Config) These additonal options (like throttle)

Maybe the type of Subject could be modified within the Input$ options. And throttle and other could be added through pipes. I think the Decorator itself should not have to many options.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment