question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Rename HostBinding or add a different decorator for global bindings

See original GitHub issue

I’m submitting a … (check one with “x”)

[ ] bug report => search github for a similar issue or PR before submitting
[x] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

We use @HostBindnig and @HostListener decorators to bind to the host element. We also use the same decorator to bind to window using the : syntax, and window is not the host element, leading to confusing syntax.

Suggested behavior

After a short discussion with @DzmitryShylovic on Gitter here are some alternatives:

  • Add a @WindowListener decorator specifically to replace current syntax window:
  • Add a @GlobalListener decorator for general global stuff (including window:, body: and potentially title:, see #11698).
  • Deprecate @HostListener and use @Binding for all of these, where leading host: would be optional since that’s the most common use-case

IMO the last alternative makes the most sense.

What is the motivation / use case for changing the behavior?

Easier to understand and consistent syntax.

  • Angular version: 2.0.0
  • Browser: all
  • Language: TypeScript

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:5
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
angular-robot[bot]commented, Jun 24, 2021

Thank you for submitting your feature request! Looks like during the polling process it didn’t collect a sufficient number of votes to move to the next stage.

We want to keep Angular rich and ergonomic and at the same time be mindful about its scope and learning journey. If you think your request could live outside Angular’s scope, we’d encourage you to collaborate with the community on publishing it as an open source package.

You can find more details about the feature request process in our documentation.

0reactions
angular-automatic-lock-bot[bot]commented, Mar 4, 2022

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Making HostBinding work with Observables - Angular inDepth
Here are a few examples where binding to streams directly would be useful: Translating attributes to a different language. If we want a...
Read more >
Combine several host bindings into one single decorator
I have components that use host binding decorators to display component selectors so that they take all the available width :
Read more >
Four ways of listening to DOM events in Angular (Part 2
We learned that the primary purpose of Angular Event Binding is to listen to events inside a component's template. So now how about...
Read more >
HostBinding - Angular
Decorator that marks a DOM property as a host-binding property and supplies configuration metadata. Angular automatically checks host property bindings ...
Read more >
Component level providers - Angular Codelab
New to Angular? ... Bind to host properties with host binding ... It is possible to add global event listeners in your Components/Directives...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found