extqa.html
2.5 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<!--
Generated template for the Extqa page.
See http://ionicframework.com/docs/v2/components/#navigation for more info on
Ionic pages and navigation.
-->
<ion-header>
<ion-navbar color="primary">
<ion-title>{{title}}</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding class="extqa-page">
<ion-card class="question-card">
<ion-card-content class="question-content">
<p>
問題 {{qa1.qaId+1}} / 全 {{qaList.length}} 問
</p>
<font size="5" [innerHTML] = "qa1.questionString"></font>
<img src="assets/img/extq/{{qa1.questionImage}}" *ngIf="qa1.questionImage != ''" />
</ion-card-content>
<br /><br />
<p *ngFor="let choice of qa1.choicesId">
<button ion-button full color="secondary" (click)="itemSelected(choice)" [outline]="selectstate[choice]" [disabled]="buttonDisabled" large>
{{qa1.choicesString[choice]}}
</button>
</p>
<ion-buttons end padding class="question-button">
<button ion-button icon-left (click)="openAnswer()" [disabled]="buttonDisabled">
<ion-icon name="checkmark"></ion-icon>
解答
</button>
</ion-buttons>
</ion-card>
<ion-card *ngIf="buttonDisabled" class="answer-card">
<ion-card-content class="answer-content">
<ion-item>
<ion-thumbnail item-left>
<img src="assets/img/ok.png" *ngIf="result == '正解'">
<img src="assets/img/ng.png" *ngIf="result != '正解'">
</ion-thumbnail>
<ion-card-title color="{{resultcolor}}">{{result}}</ion-card-title>
</ion-item>
<p><br>解答</p>
<font size="5" [innerHTML] = "qa1.answerString"></font>
<br /><br />
<img src="assets/img/exta/{{qa1.answerImage}}" *ngIf="qa1.answerImage != ''" />
</ion-card-content>
<ion-buttons end padding class="answer-button">
<button ion-button *ngIf="index < (qaList.length-1)" color="dark" icon-left (click)="goToNext()">
<ion-icon name="arrow-forward"></ion-icon>
次の問題
</button>
<button ion-button *ngIf="index >= (qaList.length-1)" color="dark" icon-left (click)="backToUnit()">
<ion-icon name="done-all"></ion-icon>
終了
</button>
</ion-buttons>
</ion-card>
</ion-content>