Float Items Button BUG

[RicardoVaranda]

Pressing the Float item button does not reset the ngc-float-button active class and creates a visual bug:

[GustavoCostaW]

@RicardoVaranda thx for the issue, can you provide a demo 'forking' the https://stackblitz.com/edit/ngc-float-button template?

[leonardovff]

@GustavoCostaW The bug occurred in here too.

[GustavoCostaW]

@RicardoVaranda @leonardovff can you provide me a demo link to reproduce this error?

[RicardoVaranda]

Project is private so sadly I am not able to give you a link to it, let me try and create a fresh repo to help you debug

[GustavoCostaW]

@RicardoVaranda can you provide me a link in stackblitz to simulate this behavior?

[gm-r]

@GustavoCostaW Here is a pretty simple case simulating this behavior, stackblitz.

Click on the first floating item and the red FAB button doesn't resize. It looks like the fab-menu active class doesn't get removed which causes the shrinking. Hope this helps!

[Marshal27]

The issue here appears to be the following in the template markup. [class.active]=\"state.getValue().display\">

• state is a BehaviorSubject
• the .getValue() method is only called once at time of render and without a subscription will not update the UI when the observable receives new data in the stream.

Modify it to the following in line 161 of ngc-float-button.component.js and the template markup will have a subscription to the Observable and toggle the class correctly. [class.active]=\"(state | async).display\">

[GustavoCostaW]

@RicardoVaranda @gabemazerogers @leonardovff

Hi guys, the problem is exactly what the @xxNoxiouSxx said, {{state.getValue().display}} was never notified when the state was changed causing the problem.

To fix that, {{(state | async).display}} is a great way that the angular provide us to subscribe the state and update the display property when the state change automatically.

Just update your ngc-float-button to 1.2.1 version and enjoy =]

Cheers to @xxNoxiouSxx.