Angular - проблема с обновлением свойств onchange из флажка - PullRequest
0 голосов
/ 23 марта 2020

Я пытаюсь использовать флажок в Angular для переключения содержимого массива. Я использую логические свойства, чтобы определить, отмечены ли 3 разных поля, и соответствующим образом изменить содержимое массива. По умолчанию массив содержит все 3 подмассива, объявив this.allNouns в ngOnInit (). Когда я щелкаю первый флажок, я вижу в консоли, что он выполняет связанную функцию onchange и устанавливает соответствующий логический параметр как противоположный, но интерполированная строка в представлении не изменяется. Когда я щелкну по нему еще раз, он изменит вид, но теперь все на шаг позади. Также, когда он попадает в журналы консоли, он загружает предыдущую длину, а не длину вновь созданного this.allNouns. Ниже приведены html и фрагменты ts, связанные с ним. Это первый из трех флажков, но я планирую применить его ко всем при сглаживании.

TS

preloadedNouns: Boolean = true;

toggleData() {
  if(this.preloadedNouns==false){
    this.allNouns=this.nouns.concat(this.onlyUserNouns);
    console.log('hitting first condition in toggledata', this.allNouns.length);
  }
  else {
    this.allNouns=this.nouns.concat(this.stockNouns).concat(this.onlyUserNouns);
    console.log('hitting second condition in toggledata', this.allNouns.length);
  }
  }

HTML

<div name="allNouns" [(ngModel)]="allNouns" [ngModelOptions]="{standalone: true}" ngDefaultControl>{{allNouns.length}}</div>

<div class="toggleDiv">
      <label>Preloaded Nouns</label>
      <input id="preloadedNounsCheck" 
      type="checkbox" 
      [checked]="preloadedNouns"
      (change)="toggleData(); preloadedNouns = !preloadedNouns">
    </div>

1 Ответ

0 голосов
/ 23 марта 2020

Я не понимаю, какие у вас существительные logi c.

<div class="toggleDiv">
      <label>Preloaded Nouns</label>
      <input id="preloadedNounsCheck" 
      type="checkbox" 
      [checked]="preloadedNouns"
      (change)="preloadedNouns = !preloadedNouns;toggleData()">
    </div>

, но я надеюсь, что основанный на моем понимании код поможет вам. просто измените порядок вызова функции в (изменить).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...