Функция обратного вызова, переданная в шаблоне Angular, не имеет доступа к компоненту

Question

Функция обратного вызова не имеет доступа ни к чему в компоненте.Я предполагаю, что должен связать «это», но я немного растерялся, где бы я это сделал.https://stackblitz.com/edit/angular-tzv5nl

В моем HTML-шаблоне у меня есть кнопка, где я передаю функцию обратного вызова в качестве аргумента:

<button (click)="primaryAction('test',furtherAction1)">Action<button>

В моем компоненте у меня есть функции

primaryAction(string,callback){
this.primaryActionDone = "Done";
callback()
}

furtherAction1(){
alert("furtherAction1 called but has no access to 'this'");
this.furtherAction1Done= "Done"; //Error: Cannot set property 'furtherAction1Done' of undefined
this.furtherAction2()
}

furtherAction2(){
this.furtherAction2Done= "Done";
}

continueAction1 не имеет доступа к this.futureAction1Done или this.futureAction2 ().
Теперь, как бы я мог иметь надлежащее "this" в функциях обратного вызова?

Answer 1

Это просто проблема объема.

Чтобы повторно привязать контекст к функции, используйте call

primaryAction(string,callback){
  this.primaryActionDone = "Done";
  callback.call(this)
}