вызов функции asyn c из контроллера angular - PullRequest
Новая
       16

вызов функции asyn c из контроллера angular

0 голосов
/ 15 февраля 2020

Я хочу вызвать функцию asyn c из angular контроллера шаблона формы. Но если я это сделаю, исполнение зависнет.

По шаблону html: 

<div class="container">
    <form>
      <div class="form-group">
        <label for="address">Identnummer (Adresse)&nbsp;*</label>
        <input type="text" class="form-control" id="address" required placeholder="0x"
                    [(ngModel)]="model.address"
                    #address="ngForm"
                    [ngClass]="setAddressCssValidityClass(address)"
                    ngControl="address">
      </div>

      <div class="row">
        <div class="col-auto">
          <button type="submit" class="btn btn-primary">Submit</button>
        </div>
        <small class="col text-right">*&nbsp;Required</small>
      </div>
    </form>
  </div>

Вот упрощенная версия моего контроллера: 

import 'package:angular/angular.dart';
import 'package:angular_forms/angular_forms.dart';

@Component(
  selector: 'sCert-validate-form',
  templateUrl: 'sCert_validate_form_component.html',
  directives: [coreDirectives, formDirectives],
)
class ScertValidateFormComponent {

  Map<String, bool> setAddressCssValidityClass(NgControl control) {
    var validityClass;
    //callCertificateByAddress(control.value);
    if(control.value == "test"){
      validityClass = 'is-valid';
      callCertificateByAddress(control.value);      
    }
    else{
      validityClass = 'is-invalid';
    }
    Map<String, bool> map = {validityClass: true};
    return map;
  }

  Future<bool> callCertificateByAddress(String address) async {
    // some code -> also does not work if removed
    return true;
  }
}

Future<bool> callCertificateByAddress(String address) async должно быть асинхронным c потому что я делаю там асин c lib. Но как мне добиться этого в сочетании с шаблоном?

Ответы [ 2 ]

0 голосов
/ 15 февраля 2020

есть проблема: здесь вы привязываете обратный вызов ко входу [ngClass]="setAddressCssValidityClass(address)" angular вызывает вашу функцию [которая вызывает сеть] в каждом цикле обнаружения изменений. и ответ от http вызывает новое обнаружение изменений, которое рекурсивно вызывает http снова и снова. сохраните результат в некоторой переменной и привяжите его к ngClass вместо метода 

ngOnInit() {
  this.classes = this.setAddressCssValidityClass(address);
}
....
[ngClass]="classes"
0 голосов
/ 15 февраля 2020

просто используйте асин c трубу вот так 

 [ngClass]="setAddressCssValidityClass(address) | async"
...