Question

我的ionic2 / angular2应用中存在问题。我正在构建一个quizz应用程序，在该应用程序中，用户被提示通过无线电选择回答问题。在做出第一个选择的那一刻，我得到了这个错误：

EXCEPTION: Attempt to use a dehydrated detector: QuizzPage_2 -> select

控制台：

当我调试Pause On Exception时，代码会中断：

  SafeSubscriber.prototype.__tryOrUnsub = function (fn, value) {
        try {
            fn.call(this._context, value);
        }
        catch (err) {
            this.unsubscribe();
            throw err;

以下是我的主要文件：

page.html：

(...)
<ion-item radio-group  *ngFor="#choice of quizz.getChoices()">
    <ion-label>
      <p courant>{{ choice }}</p>
    </ion-label>
    <ion-radio (click)="onSubmit($event, choice)">
      {{ choice }}
    </ion-radio>
</ion-item>
(...)

我的page.ts：

import {Page, NavController, NavParams} from 'ionic-angular';
import {Quizz} from '../models/quizz';
import {QuizzResultsPage} from './quizz-results.page';
import quizzes from '../../data/quizzes';

@Page({
  templateUrl: 'build/pages/quizz/Quizzes/templates/quizz.page.html',
})

export class QuizzPage {
  nav;
  quizz;

  constructor(nav: NavController, params: NavParams) {
    this.nav = nav;
    // Load the quizz with passed topicId from the params.get (import{NavParams})
    this.quizz = this.loadQuizz(params.get('topicId'));
  }

  loadQuizz(topicId) {
    // cont quizz = data (import quizzes from '../../data/quizzes';)
    const quizz = quizzes.filter((quizz) => {
      return quizz.topicId === topicId;
    })[0];
    return new Quizz(quizz);
  }

  onSubmit(event, answer) {
    this.quizz.submitAnswer(answer);
    if (this.quizz.isCompleted) {
      this.nav.push(QuizzResultsPage, {
        quizz: this.quizz
      });
    }
  }

}

我仍然可以完成这个问题，但最后在我的结果页面中，我无法返回或重新启动这个问题，而我的导航条也会中断......

我的resultpage.html：

(...)
<ion-card-content>
      <p>
        Votre score:
        <span primary>{{ quizz.getScore() }}</span> / <b>{{ quizz.getGradingScale() }}</b>
      </p>
    </ion-card-content>
  </ion-card>

  <!-- Questions with answers -->
  <div [hidden]="quizz.isPerfect()">
    <ion-card *ngFor="#i of quizz.items" style="background-color:aliceblue;">
      <ion-card-header>
        <b bluegray text-uppercase>Question: </b>
        <p>
          {{ i.question }}
        </p>
      </ion-card-header>
      <ion-card-content>
        <b bluegray text-uppercase>Réponse:</b>
        <p courant text-justify>{{ i.answer }}</p>
      </ion-card-content>
    </ion-card>
  </div>


  <!-- Exit & Restart -->
  <div padding style="width:70%; margin: 0 auto">
    <button item-right block (click)="onHomeClicked($event)">Recommencer
      <ion-icon name="refresh-circle"></ion-icon>
    </button>
    <button itel-left block (click)="onGoHome($event)">Accueil
      <ion-icon name="home"></ion-icon>
    </button>
  </div>
</ion-content>

最后我的结果。：

import {Page, NavController, NavParams} from 'ionic-angular';
import {TopicsPage} from '../../topics';
import {Home} from '../../../home/home';

@Page({
  templateUrl: 'build/pages/quizz/Quizzes/templates/quizz-results.page.html',
})

export class QuizzResultsPage {
  nav;
  quizz;

  constructor(nav: NavController, params: NavParams) {
    this.quizz = params.get('quizz');
    this.nav = nav;
    this.nav.pop();
  }

  onHomeClicked(event) {
    this.nav.setRoot(TopicsPage);
    this.nav.pop(TopicsPage);
  }

  onGoHome(event){
    this.nav.setRoot(Home);
    this.nav.pop(Home);
  }

有人有想法吗？感谢

Angular2：EXCEPTION：尝试使用脱水检测器：QuizzPage_2 - ＆gt;选择

0 个答案: