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

Close menu when we click outside #16

Open
it-sumanp opened this issue Apr 12, 2018 · 11 comments
Open

Close menu when we click outside #16

it-sumanp opened this issue Apr 12, 2018 · 11 comments

Comments

@it-sumanp
Copy link

No description provided.

@gkimpson
Copy link

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

@sumanok
Copy link

sumanok commented May 16, 2018

No :(

@it-sumanp
Copy link
Author

No .. I could not found any solution :(

@GustavoCostaW
Copy link
Owner

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
Copy link

+1

@mptardy
Copy link

mptardy commented Aug 6, 2018

+1
Has anybody found a workaround?

@gkimpson
Copy link

gkimpson commented Aug 6, 2018

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

@miodrage
Copy link

miodrage commented Aug 8, 2018

@gkimpson Hey buddy,

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

@gkimpson
Copy link

gkimpson commented Aug 9, 2018

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
Copy link
Author

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

Thanks
~ Suman

@gkimpson
Copy link

gkimpson commented Aug 20, 2018

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants