Угловая привязка в Promise не работает в ngOnInit

В Angular я использую простую функцию, которая возвращает обещание, а в функции «затем» я меняю src html-тега Img. когда я вызываю эту функцию из NgOnInit (или из onclick), html не будет обновляться до тех пор, пока я не заставлю содержимое перезагрузиться, еще раз щелкнув что-то. но colsole.log работает.

  click1() {
    this.loadCaptcha();
  }

  ngOnInit(): void {
    this.loadCaptcha();
  }

  loadCaptcha() {
    this.apiService.getCaptcha()
      .then((data) => {
        this.image = 'http://....' + data.id;
        console.log(data);
      });
  }

<img [src]='image' (click)="click1()" />

angular binding promise ngoninit
person mojtaba shafaghi    schedule 14.01.2021    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Попробуйте использовать DomSanitizer

 constructor(private sanitizer: DomSanitizer) { }
 
  ngOnInit() {
  this.apiService.getCaptcha()
      .then((data) => {
        let objectURL = 'data:image/jpeg;base64,' +  data.id;
        this.image  =this.sanitizer.bypassSecurityTrustUrl(objectURL);
        console.log(data);
      });
       
  }
}

Надеюсь, полезно

person A.khalifa    schedule 14.01.2021
comment
я тоже так делал, но не получилось. мне нужно нажать что-то вроде кнопки разбивки на страницы, чтобы просмотреть результат, в вашем образце элемент img отключен до тех пор, пока не будет нажата кнопка разбиения на страницы. - person mojtaba shafaghi; 14.01.2021
comment
Я редактирую свой ответ проверить сейчас - person A.khalifa; 14.01.2021
comment
я сделал это в OnClick кнопки и получил тот же результат. проблема не связана с ngOnInit, это связано с рендерингом, тот же вопрос здесь: stackoverflow.com/questions/61655099/ - person mojtaba shafaghi; 14.01.2021
comment
Проверьте сейчас, надеюсь, это сработает для вас - person A.khalifa; 14.01.2021

arrow_upward
0
arrow_downward

Я решаю это, проблема заключается в строке кода, которая существует в шаблоне Metronic, которая отключает привязку данных. отключив модификацию changeDetection, привязка снова заработала.

changeDetection: ChangeDetectionStrategy.OnPush,
person mojtaba shafaghi    schedule 15.01.2021