Close menu when we click outside

[gkimpson]

@it-sumanp did you find a solution for this?

[sumanok]

No :(

[it-sumanp]

No .. I could not found any solution :(

[GustavoCostaW]

Hi guys, it's very appreciate you all are using this lib, I'm so busy now, but I'm receiving some emails and I hope next week I will work on that.

[miodrage]

+1

[mptardy]

+1 Has anybody found a workaround?

[gkimpson]

I did - not at computer to post the solution will do this tomorrow

[miodrage]

@gkimpson Hey buddy,

Will you be able to post that solution in the next couple of days?

[gkimpson]

Sorry will do this soon just skipped my mind :-) The method I have may not be the best but it did seem to work for what I needed to do

[it-sumanp]

@gkimpson Can you please take some time and post the proposed solution

Thanks ~ Suman

[gkimpson]

Sorry for the delay I hope this helps - I cannot do the whole solution but this should get someone I hope on the right track..

https://github.com/GustavoCostaW/ngc-float-button - this has a close button functionality (scroll down the docs) - so in theory using this solution we need a way in Angular to recognise when we have a) Clicked "outside" the ngc float button and b) if the ngc float button is open then call the close function

I did a similar technique elsewhere using the handleClickEvent in my component

handleClickEvent(event): void {
    // click events for the float button
    if (this.floatButtonVisible) {
        var isSelf = false; // user has clicked 'itself' in this case within the ngc-float-button div
        // wrap your ngc divs add add them here
        for (let value of ['my-ngc-float-div',]) {
            if (event.target.classList.contains(value)) {
                isSelf = true; // have clicked within the ngc float div
            }
        }

        // have clicked outside the ngc-float-button div
        if (!isSelf) {
            this.sortVisible = false;
           // run something to call the open.next(false) show in the demo here
          https://stackblitz.com/edit/ngc-float-button
        }
    }
}

Sorry for the non fully complete solution will try to post a fuller reply when I get time to