Devextreme-angular: How to two-way bind to dxToolBar item

[SidorovX86]

Hello,

In your ToolBar example there https://js.devexpress.com/Demos/WidgetsGallery/Demo/Toolbar/Overview/Angular/Dark/ we have dxSelectBox widget.

What if we want two-way bind it value. For example,I created the button "Clear" an when I press it, Value of dxSelectBox should set to null.

How we can achieve this?
Thanks,
Alexander.

[GoshaFighten]

So that Angular binding works, it's necessary to declare it in the component template. So, move the dxToolbar items declaration from the component code behind to its template. This will look like the following:
 

<dx-toolbar>
<dxi-item location="after" locateInMenu="auto">
<dx-select-box [width]="140" [items]="productTypes" valueExpr="id" displayExpr="text" [(value)]="selectedValue" (onValueChanged)="onSelectedValueChanged($event)"></dx-select-box>
</dxi-item>
</dx-toolbar>

 
I've also prepared a Plunker sample for you to illustrate this in action. Let me know if you have any questions on this.