Как обновить HTML из функции asyn c? - PullRequest
Новая
       69

Как обновить HTML из функции asyn c?

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

Мне нужно вызвать функцию asyn c. Из этой функции поле html должно быть обновлено. В следующем коротком примере это будет {{typeStream | async}}. 

<div class="container">
  <form>
    <mark>{{typeStream | async}}</mark>
    <hr>
    <div class="form-group">
      <input type="text" class="form-control" id="address" required placeholder="0x" #address="ngForm"
        [ngClass]="classes" ngControl="address" (ngModelChange)="setAddressCssValidityClass(address)">
    </div>
  </form>
</div>

Моя последняя попытка в Компоненте использовала StreamController различными способами. Но я не нашел способа обновить поле html {{typeStream | async}}. setAddressCssValidityClass () вызывается правильно, потому что установка класса в шаблоне работает.

Вот последняя попытка для моего компонента: 

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

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

  var classes;
  StreamController<String> typeController = StreamController<String>.broadcast();
  Stream<String> typeStream;

  Future<Null> ngOnInit() async {
    typeStream = typeController.stream;
  }

  void setAddressCssValidityClass(NgControl control) {
    var validityClass; 
    String value = control.value;
    if(value.length == 42){
      validityClass = 'is-valid';
      callByAddress(control.value);
    }
    else{
      validityClass = 'is-invalid';
    }
    Map<String, bool> map = {validityClass: true};
    classes = map;
  }

  Future<bool> callByAddress(String address) async {    
    // Some code which needs async
    typeController.add("Hello World!"); 
    return true;
  }
}

1 Ответ

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

Похоже, ваш поток никогда не инициализируется. Вам необходимо реализовать OnInit, чтобы ваш метод ngOnInit() вызывался во время жизненного цикла компонента, в противном случае он никогда не будет выполнен, а ваш поток останется нулевым. 

class ScertValidateFormComponent implements OnInit {

  var classes;
  StreamController<String> typeController = StreamController<String>.broadcast();
  Stream<String> typeStream;

  @override
  void ngOnInit() {
    typeStream = typeController.stream;
  }

  ...

Но рассмотрите этот шаблон вычисляемого свойства, вместо которого вы получите свой поток. : 

  StreamController<String> typeController = StreamController<String>.broadcast();
  Stream<String> get typeStream => typeController.stream;
...