I have a modal view that I am opening using the ModalDialogService. Almost none of the views labels, image, or buttons were behaving as expectedly. After spending hours to track down the issue here is what I found:
If the root AppComponent has changeDetection: ChangeDetectionStrategy.OnPush set, no bindings will be properly set in any modal dialog in the app.
This includes binding button text, label text, Image source.
This does not seem to prevent events from firing.
I have created a nativescript playground app that shows the issue:
https://play.nativescript.org/?template=play-ng&id=rxarWp&v=3
If you tap 'Open Modal' the modal should have a Button and 3 Labels, however two of those labels don't show up because their text was set using a binding.
To fix those bindings all you need to do is comment out the line
changeDetection: ChangeDetectionStrategy.OnPush
from app.component.ts.
Thanks for your help!
Hi @vultix,
Thank you for the provided sample project.
I reviewed it and have to confirm that there is a real issue with the binding of the modal page.
For further info about the problem, please keep track on the issue.
I'm also suffering this problem, but I can't solve it by changing the ChangingDetectionStrategy, it doesn't work for me.
Also confirm: if remove ChangeDetectionStrategy.OnPush from the app.component all works as expected...
I've managed to get bindings working in modals by simply adding a loaded eventlistener in the modal template upper container, <StackLayout (loaded)="null">
Running latest Nativescript and Angular, and OnPush strategy in every component.
There is another issue that might be related (or not). The same happens if provided vcRef is of a child component rather than of a page. The workaround is to keep track of the page vcRef and use it instead. Can't wait for these fixes. Our team spent lots of hours debugging change detection issues in NS.