Как изменить this.variable в функции jquery?

Question

Как изменить this.variable класса AuthDirective в функции jquery?

возможно глупый вопрос, но мне нужно использовать события Jquery и изменить / работать с угловыми переменными.

import { Component, Directive, OnInit } from '@angular/core';
import { AppGlobal                    } from '../../../app.global';
declare var $:any;

@Component({
  selector    : 'authorization',
  templateUrl : './auth.directive.html'
})
export class AuthDirective {
  isCaptcha : boolean = false;
  constructor(
    public  app : AppGlobal
  ) {
  }
  ngOnInit() {
    $('.sign-up-label').on('show.bs.modal', function (e) {
      this.isCaptcha = true; // NOT IN THIS CONTEXT, IN THAT CONTEXT
    })
  }
}

{{isCaptcha}} всегда ложно

<div class="form-group ta-web-right mt-3" *ngIf="isCaptcha">
  <re-captcha (resolved)="resolved($event)"></re-captcha>
</div>

Помогите пожалуйста.

Answer 1

сохраняет внешний контекст как этот let self = this;, и тогда он не конфликтует с локальным контекстом.

замените function на

ngOnChanges(changes: SimpleChange) {
    let self = this;
    $('.sign-up-label').on('show.bs.modal', function (e) {
      self.isCaptcha = true; // NOT IN THIS CONTEXT, IN THAT CONTEXT
    })
  }

Answer 2

Вы можете сохранить значение this из внешнего контекста, присвоив его переменной:

ngOnInit() {
    var self = this;
    $('.sign-up-label').on('show.bs.modal', function (e) {
      self.isCaptcha = true;
    })

}