Ошибка «Не удается прочитать свойство« _view »of null» при прерывании угловой анимации » - PullRequest
Новая
       13

Ошибка «Не удается прочитать свойство« _view »of null» при прерывании угловой анимации »

0 голосов
/ 18 января 2019

У меня есть страница с несколькими ответами, где пользователь может щелкнуть один из них, чтобы выбрать правильный. Когда выбор сделан, анимация срабатывает, показывая пользователю, правильно ли он сделал выбор. Когда пользователь готов, он нажимает кнопку «Далее», чтобы перейти к следующему вопросу.

Проблема в том, что пользователь нажимает кнопку «Далее» до завершения анимации значка. Когда я запускаю анимацию до конца, я не получаю сообщение об ошибке.

Это для ионного применения: 

Ionic:

   ionic (Ionic CLI)  : 4.3.1 (/Users/rpatulski/.nvm/versions/node/v10.13.0/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.1

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4
   Cordova Plugins       : no whitelisted plugins (13 plugins total)

System:

   NodeJS : v10.13.0 (/Users/rpatulski/.nvm/versions/node/v10.13.0/bin/node)
   npm    : 6.4.1
   OS     : macOS High Sierra

со следующими угловыми версиями: 

@angular/core@4.1.3
@angular/animations@4.1.3

Ответы выводятся в цикле for в шаблоне ExamDetailsPage.html: 

<ng-container *ngFor="let curAnswer of question.possibleAnswers">
    <ion-item [ngClass]="getRowAnswerClass(curAnswer)" id={{curAnswer.rowId}} *ngIf="curAnswer.rowId && curAnswer.rowId !==''" (click)="clickedRow(curAnswer)">
        <h5 item-title>{{curAnswer.Text}}</h5>
        <ion-icon [@iconAnimationTrigger]="iconAnimationState" (@iconAnimationTrigger.done)="answerChosenFinished($event)" invalid-icon icon-medium item-right name="close-circle">
        </ion-icon>
        <ion-icon [@iconAnimationTrigger]="iconAnimationState" (@iconAnimationTrigger.done)="answerChosenFinished($event)" correct-icon icon-medium item-right name="checkmark-circle">
        </ion-icon>
    </ion-item>
</ng-container>

обратите внимание, что question.possibleAnswers - это данные компонента.

Когда пользователь нажимает следующую кнопку, запускается следующая функция: 

showQuestion(){
    ...
    this.indexQ++;
    // the following changes the data needed in the template
    this.question = this.questionArray[this.indexQ - 1];
    ...
}

Не прерывая анимацию нажатием кнопки «Далее», я не получаю сообщения об ошибке, в противном случае у меня возникает ощущение, что что-то идет не так с обнаружением изменений. Это трассировка стека: 

ERROR TypeError: Cannot read property '_view' of null
    at ViewContainerRef_.move (core.es5.js:10136)
    at common.es5.js:1722
    at DefaultIterableDiffer.forEachOperation (core.es5.js:7021)
    at NgForOf._applyChanges (common.es5.js:1711)
    at NgForOf.ngDoCheck (common.es5.js:1701)
    at checkAndUpdateDirectiveInline (core.es5.js:10818)
    at checkAndUpdateNodeInline (core.es5.js:12238)
    at checkAndUpdateNode (core.es5.js:12177)
    at debugCheckAndUpdateNode (core.es5.js:12880)
    at debugCheckDirectivesFn (core.es5.js:12821)

1 Ответ

0 голосов
/ 19 января 2019

Я решил проблему, не вызывая вручную receiveChanges, который отсутствовал в моем исходном сообщении: 

answerChosenFinished(event: AnimationEvent) {
    this.iconAnimationState = IDLE_ANIM_STATE;
    this.changeDetector.detectChanges(); // removed this
}
...