-
Notifications
You must be signed in to change notification settings - Fork 4.7k
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
p-button: Duplicate icons shown when using directive and [loading] #13716
Comments
Again this problem? |
@SoyDiego I found a minimal reproducible scenario. To repro: Template:
TypeScript:
|
Probably, it's not being released. I tried with the latest master branch and couldn't reproduce the issue. |
I don't know why your last two issues (this issue and #13636), I couldn't reproduce it. For me it's working as expected. My codeTesting |
Share a stackblitz with the versions exactly that you have in your project. If this problem existed, I'm sure more people would report it as has happened before. Buttons are a very important part of a website and yet no one wrote any issue except you. I think there is some problem in your particular project because as I said before, I couldn't reproduce another issue of yours either. |
I can't get StackBlitz working with PrimeNG 16.3.1. I wish I could. If anyone has success setting an empty example up that uses PrimeNG 16.3.1 and not v14 I'll happily use it. Here's another strange thing I just noticed. If I set
While loading: As you can see, the After loading they both look correct: I have looked into the PrimeNG source code for I have inspected the DOM in these cases and we have no custom CSS or anything else trying to override behavior on these. Switching |
@psarno maybe you can write your problem about stackblitz in the new forums https://github.com/orgs/primefaces/discussions/categories/primeng |
I have same issue. primeng 16.3.1 |
Sorry I cannot replicate. I tried and I sent a gif above. @cetincakiroglu |
I have change detection onpush in my component. maybe this will help you reproduce the problem |
@cetincakiroglu the problem is still here. primeng 17.18.1 angular 18.0.3 |
Fixed in PrimeNG 17.18.2 |
@cetincakiroglu I think you can close the issue |
Describe the bug
When we use
<button pButton pRipple>
and bind its[loading]
proprety to a boolean, we see two icons on the button when the boolean is set back to false.It includes both the loading spinner icon as well as the icon set in the icon attribute. Defined as:
To reproduce:
Note that setInterval in the reproducer is just to simulate some work being done.
If we replace this
<button>
with a<p-button>
, it works as expected.Environment
Angular 16.2.2
PrimeNG 16.3.1
Reproducer
No response
Angular version
16.2.2
PrimeNG version
16.3.1
Build / Runtime
Angular CLI App
Language
TypeScript
Node version (for AoT issues node --version)
18.16.0
Browser(s)
No response
Steps to reproduce the behavior
<button pButton pRipple>
element with[loading]="isLoading"
isLoading
boolean to trueisLoading
back to false, simulating the loading is completeButton is re-enabled, but shows two icons
Expected behavior
Button should not still show the loading spinner icon when the loading property is set back to false.
The text was updated successfully, but these errors were encountered: