0

I am using the Devextreme and I want to call a angular method in my component when clicking the button. That's my codes;

component.html

<div id="form-container">
  <dx-form (onFieldDataChanged)="form_fieldDataChanged($event)">
    <dxi-item dataField="userName" editorType="dxTextBox"></dxi-item>
    <dxi-item dataField="password" editorType="dxTextBox" [editorOptions]="{ mode: 'password' }"> </dxi-item>
    <dxi-item 
            itemType="button"
            [buttonOptions]="buttonOptions">
        </dxi-item>
  </dx-form>
</div>

component.ts

export class LoginComponent implements OnInit {
  constructor(private _loginService: LoginService) {
  }
  buttonOptions = {
    text: 'Login',
    type: 'success',
    onClick: function () {
      !!!!ERROR!!!!   loginn(); !!!!ERROR!!!!
    }
  };
  loginn() {
    alert('loginn');
  }
  form_fieldDataChanged(e) {
  }
  ngOnInit() {
  }
}

And I want to call from another javascript function.

function trycallmethod() {
  const o = new LoginComponent(null);
  o.loginn();
}

So how can I call the angular method in javascript function?

Thanks.

kursat sonmez
  • 818
  • 1
  • 12
  • 22
  • 1
    `onClick: () => this.loginn() !!!SHOULD WORK` – yurzui Aug 26 '18 at 15:58
  • 1
    Possible duplicate of [How to access the correct \`this\` inside a callback?](https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a-callback) – ConnorsFan Aug 26 '18 at 16:00
  • I don't think this one is about the `this` -- the `new LoginComponent(null)` part is super finishy and weird. – Lazar Ljubenović Aug 26 '18 at 16:15
  • Even if you can access an angular component function outside of the Angular framework, I would not suggest to do so as it potentially indicates something wrong with your code architecture. – Xinan Aug 26 '18 at 16:26
  • Thank you for your answers. Solved problem. But Is it enough? solution: onClick: () => this.loginn() @Xinan You may be right but I need it like this structures as you see for this situations. – kursat sonmez Aug 26 '18 at 20:35

0 Answers0