文章/答案/技术大牛

发布

社区首页 >问答首页 >中断角度动画时出现"Cannot read property '_view‘of null“错误

问中断角度动画时出现"Cannot read property '_view‘of null“错误
EN

Stack Overflow用户

提问于 2019-01-18 22:38:12

回答 1查看 128关注 0票数 1

我有一个有多个答案的页面，用户可以点击其中一个来选择正确的答案。做出选择时，会触发一个动画，向用户显示他们的选择是否正确。当用户完成后，他们点击“下一步”按钮来进入下一个问题。

问题是当用户在图标动画结束之前点击下一步。当我让动画运行到最后时，我没有得到错误消息。

这是针对离子应用程序的：

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版本：

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

答案被绘制在ExamDetailsPage.html模板中的for循环中：

<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是来自组件的数据。

当用户点击next按钮时，将运行以下函数：

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)

angular

ionic-framework

angular-animations

回答 1

Stack Overflow用户

发布于 2019-01-19 16:54:22

我解决了这个问题，因为我没有手动调用detectChanges，这在我最初的帖子中是没有的：

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

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/54256134

复制

相似问题

问中断角度动画时出现"Cannot read property '_view‘of null“错误
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问中断角度动画时出现"Cannot read property '_view‘of null“错误EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问中断角度动画时出现"Cannot read property '_view‘of null“错误
EN