I have component with some fields, methods and button events for buttons. There is my component:
export class MyClass implements OnInit, AfterViewInit {
@ViewChild(DxDataGridComponent, { static: true })
dataGrid: DxDataGridComponent;
myArr: Array<string>
//some fields here...
constructor(
//some things
) {
//some code in contructor
}
customFunc(e)
{
this.myArray=this.doSth(); <- err
}
And there is my grid-view (I use devExtreme):
<div class="card">
<div class="card-body">
<dx-data-grid
id="feature-releases"
[disabled]="isBusy"
[dataSource]="gridDataSource"
[showColumnLines]="true"
[showRowLines]="true"
[showBorders]="true"
(onSelectionChanged) ="onSelectionChanged()"
(onRowUpdating)="updateRow($event)"
(onToolbarPreparing)="onToolbarPreparing($event)"
[rowAlternationEnabled]="true">
<dxo-selection
mode="multiple"
[allowSelectAll]="false"
showCheckBoxesMode="always"
>
</dxo-selection>
<dxo-editing mode="form" [allowUpdating]="true" [allowDeleting]="true" [useIcons]="true">
<dxo-form onClick="customFunc($event)">
<dxi-item itemType="group" caption="Info">
<dxi-item dataField="position"></dxi-item>
<dxi-item dataField="versionNumber"></dxi-item>
<dxi-item dataField="name"></dxi-item>
<dxi-item dataField="created"></dxi-item>
<dxi-item dataField="updated"></dxi-item>
</dxi-item>
<dxi-item itemType="group" caption="Data">
<dxi-item dataField="description"></dxi-item>
<dxi-item dataField="notes" [label]="{ text: 'Update Message' }" editorType="dxTextArea" [editorOptions]="{ height: 170 }"></dxi-item>
</dxi-item>
<dxi-item caption="Editor">
<app-feature-release-editor
[selectedReleases] = "selectedReleases">
</app-feature-release-editor>
<app-feature-release-create (featureReleaseCreated)="onFeatureReleaseCreated($event)"></app-feature-release-create>
</dxi-item>
<dxi-column type="buttons">
<dxi-button name="edit" [onClick] = "customFunc"></dxi-button>
<!-- <dxi-button id="iD" icon="trash" [onClick]="remove"></dxi-button> -->
</dxi-column>
</dxo-form>
</dxo-editing>
</div>
</div>
And then - after I click on edit button event is called properly, but i can't use any of fields from my component.Nothing is "visible" inside the funtion. I need to data from event (id, and some other) and pass it to the collection. How can i Do it? It's just only a part of my code, so syntax, or closing signs (like '<') can be wrong - but it's not point of my question.
You are probably in a different scope. You can bind the instance of your component to your customFunc
function to access the class.
Add the following to your constructor
:
constructor() {
this.customFunc = this.customFunc.bind(this);
}