Search code examples
angularangular-ivy

Trigger change detection in Angular IVY application


Before IVY, we could trigger change detection like this, based on this awesome SO answer:

ng.probe(getAllAngularRootElements()[0]).injector.get(ng.coreTokens.ApplicationRef).tick()

The question now is, how do we achieve this in Ivy?

When running in dev mode, and typing ng in the console reveals this:

enter image description here

But I am unsure how to use this to detect changes in the root element?

workaround

By injecting the ChangeDetectorRef in a given component, i can do the following (where $0 is the previously selected element in the dev tools):

ng.getComponent($0).changeDetectorRef.detectChanges()

But this is not for the root component?


Solution

  • You can call

    ng.markDirty($0)
    

    Where $0 is the selected element in the devtools panel.

    In v9 it's the applyChanges method.