(Showing Draft Content)

WjOptions Class

WjOptions Class

Exposes global options for the Wijmo for Angular 2 interop.


  • WjOptions



Static asyncBindings

asyncBindings: boolean

Indicates whether Wijmo components update binding sources of the two-way bound properties asynchronously or synchronously.

If this property is set to true (default) then changes to the Wijmo components' properties with two-way bindings (like WjInputNumber.value) will cause the component to update a binding source property asynchronously, after the current change detection cycle is completed. Otherwise, if this property is set to false, the binding source will be updated immediately. A corresponding property change event (like WjInputNumber.valueChanged) is also triggered asynchronously or synchronously depending on this property value, after the binding source was updated.

This global setting can be changed for specific instances of Wijmo components, by assigning the component's asyncBindings property with a specific boolean value.

Transition to asynchronous binding source updates has happened in Wijmo version 350. Before that version, binding sources were updated immediately after the component's property change. In some cases this could lead to the ExpressionChangedAfterItHasBeenCheckedError exception in the applications running Angular in the debug mode. For example, if your component's property value is set to 0.12345, and you two-way bind it to the value property of the WjInputNumber component with the format property set to 'n2', the WjInputNumber immediately converts this value to 0.12. This change, in turn, causes Angular to update your component property (the source of this binding), so that its value changes from 0.12345 to 0.12. If this source update is performed synchronously then the binding source property changes its value during the same change detection cycle, which is prohibited by Angular. If Angular runs in debug mode then it executes a special check after every change detection cycle, which detects this change and raises the ExpressionChangedAfterItHasBeenCheckedError exception. Asynchronous binding source updates resolve this problem, because the binding source property is updated after the current change detection cycle has finished.

If the ExpressionChangedAfterItHasBeenCheckedError is not an issue for you, and parts of you application logic are sensible to a moment when binding source update happens, you can change this functionality by setting the global asyncBindings property to false. This should be done before the first Wijmo component was instantiated by your application logic, and the best place to do it is the file where you declare the application's root NgModule. This can be done with the code like this:

import * as wjBase from 'wijmo/wijmo.angular2.directivebase';
wjBase.WjOptions.asyncBindings = false;

Alternatively, you can change the update mode for the specific component using its own asyncBindings property. For example:

<wj-input-number [asyncBindings]="false" [(value)]="amount"></wj-input-number>