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

Dropdown does not hide on Push ChangeDetection #1754

Closed
variable-content opened this issue Jan 9, 2017 · 7 comments
Closed

Dropdown does not hide on Push ChangeDetection #1754

variable-content opened this issue Jan 9, 2017 · 7 comments
Assignees
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@variable-content
Copy link

I'm submitting a ... (check one with "x")

[ ] bug report => Search github for a similar issue or PR before submitting
[X] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)
http://plnkr.co/edit/rbQWTdX8EbVHfHvqu42E

Current behavior
Create a component that implements OnPush change detection strategy and use the primeng dropdown component within it. Click the dropdown to open the select list panel click outside the dropdown (and don't hover the mouse back inside the panel). The panel stays open and doesn't close.

Expected behavior
The panel should close.

Minimal reproduction of the problem with instructions
See steps above

What is the motivation / use case for changing the behavior?
I have components that require the performance benefits of OnPush that I'd like to also use the dropdown component within, but cannot due to this.

  • Angular version: 2.1.X

  • PrimeNG version: 1.0.1

  • Browser: All

  • Language: All

@variable-content
Copy link
Author

Also, it would be great if OnPush change detection could be added to the roadmap for all primeng components.

@sdadas
Copy link

sdadas commented Feb 24, 2017

For anyone having the same problem, here's a quick and dirty hack to force Dropdown update with OnPush strategy:

Dropdown.prototype.originalHide = Dropdown.prototype.hide;
Dropdown.prototype.hide = function() {
    this.originalHide();
    this.cd.markForCheck();
};

Dropdown.prototype.originalUnbindDocumentClickListener = Dropdown.prototype.unbindDocumentClickListener;
Dropdown.prototype.unbindDocumentClickListener = function () {
    this.originalUnbindDocumentClickListener();
    this.cd.markForCheck();
};

@variable-content
Copy link
Author

@huineng
Copy link

huineng commented Mar 14, 2017

I've added a document:click listener, but prefer a solution from prime

@HostListener('document:click', ['$event'])
    public clickout(e: Event): void {
         this.cd.markForCheck();
    }

@cagataycivici
Copy link
Member

cagataycivici commented Mar 22, 2017

Duplicate of #1971, no? Let's discuss there.

#1971

@cagataycivici cagataycivici changed the title Dropdown component doesn't support OnPush change detection strategy Dropdown does not hide on Push ChangeDetection Mar 22, 2017
@cagataycivici cagataycivici self-assigned this Mar 22, 2017
@cagataycivici cagataycivici added the Type: Bug Issue contains a bug related to a specific component. Something about the component is not working label Mar 22, 2017
@cagataycivici cagataycivici added this to the 4.0.RC2 milestone Mar 22, 2017
@cagataycivici cagataycivici reopened this Mar 22, 2017
@cagataycivici
Copy link
Member

I see, this issue is different than the one we fixed. I've added the check to fix it. Thanks.

@variable-content
Copy link
Author

Can you re-open the issue until it's fixed? It would help prevent others logging a duplicate issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

No branches or pull requests

4 participants