Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] input aliasing decorator selector not rendered correctly #155

Closed
rubenprins opened this issue Apr 24, 2024 · 4 comments
Closed

[Bug] input aliasing decorator selector not rendered correctly #155

rubenprins opened this issue Apr 24, 2024 · 4 comments
Assignees
Labels
Status: Released Type: Bug Something isn't working

Comments

@rubenprins
Copy link

Is this a regression?

I don't know

Description

When you have a decorator input that has a template name that aliases the decorator's attribute selector, the demo code rendered is incorrect, because the selector is rendered as-is (without square brackets or value), and then the input is rendered too, in square brackets, but with the input name rather than the template name.

This can be seen with the Playground > Decorators example for the NgDocRotatorDirective.

@Directive({
	selector: '[ngDocRotator]',
	standalone: true,
})
export class NgDocRotatorDirective implements OnChanges, OnInit {
	/** Rotator state */
	@Input('ngDocRotator')
	rotated: boolean = false;

Expected template when ngDocRotator is checked in the playground pane:

<button [ngDocRotator]="true">
  Button
</button>

Actual:

<button ngDocRotator [rotated]="true">
  Button
</button>

This is incorrect, because the rotated input's template name was aliased to ngDocRotator.

Note that if your input was defined as

@Directive({
	selector: '[ngDocRotator]',
	standalone: true,
})
export class NgDocRotatorDirective implements OnChanges, OnInit {
	/** Rotator state */
	@Input()
	ngDocRotator: boolean = false;

then you'd get the ngDocRotator twice:

<button [ngDocRotator]="true" ngDocRotator>
  Button
</button>

Please provide the exception or error you saw

No exceptions are shown.

OS

Unix (Linux, macOS, etc.)

Browser

Chrome

Node version

N/A

Anything else?

Additionally, it appears that if you put your component/directive attribute in square brackets in your playground template already, to demo a non-default value, the template parser doesn't find it. Probably because it looks for the non-bracketed attribute.

@rubenprins rubenprins added the Type: Bug Something isn't working label Apr 24, 2024
@skoropadas
Copy link
Member

Thanks for the ticket I'll fix it asap!

skoropadas pushed a commit that referenced this issue Apr 24, 2024
## [17.6.3](v17.6.2...v17.6.3) (2024-04-24)

### Bug Fixes

* **app:** input aliasing selector renders in playground template using property name ([d7cf81e](d7cf81e)), closes [#155](#155)
@skoropadas
Copy link
Member

🎉 This issue has been resolved in version 17.6.3 🎉

The release is available on:

Your semantic-release bot 📦🚀

@rubenprins
Copy link
Author

Wow, that was really quick, thanks! Demo page looks good, and I'll try it out my own setup.

@skoropadas
Copy link
Member

Sure! If it's a bug that breaks some functionality then yeah I'm trying to close it in one day, but features/improvements may take more time

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Released Type: Bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants