结果页面

config.xml

 <?xml version='1.0' encoding='utf-8'?>
-<widget id="io.ionic.smart19.starter.test" version="4.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+<widget id="io.ionic.smart19.starter.test" version="4.0.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
     <name>党建云平台(测试)</name>
     <description>An awesome Ionic/Cordova app.</description>
     <author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>

src/pages/home/learning/learning-do/learning-do.ts

@@ -31,6 +31,14 @@ export class LearningDoPage {
                 public toastCtrl: ToastController, public appService: AppService, public datePipe: DatePipe) {
     }
 
+    ionViewDidLoad(){
+        this.navbar.backButtonClick= ()=>{
+            this.appService.alert("是否退出当前测试，中途退出直接交卷？"),()=>{
+                this.submit();
+            }
+        };
+    }
+
     ionViewDidEnter() {
         this.testId = this.navParams.get('testId');
         this.title = this.navParams.get('title');
@@ -47,11 +55,6 @@ export class LearningDoPage {
                 this.countTime();
             }
         )
-        //返回按钮的提示
-        this.navbar.backButtonClick = (event) => {
-            let index = this.navCtrl.length() - 2;
-            this.navCtrl.remove(2, index)
-        }
     }
 
     //清楚定时器

src/pages/home/learning/learning-result/learning-result.ts

@@ -62,7 +62,8 @@ export class LearningResultPage {
     reviewTest() {
         this.navCtrl.push("ReviewLearnPage",{
             recordId:this.result.recordId,
-            score:this.result.score
+            score:this.result.score,
+            title:this.title,
         })
     }
 

src/pages/home/learning/review-learn/review-learn.html

@@ -8,15 +8,15 @@
 
 <ion-content>
   <div class="main-container">
-    <ion-slides>
-      <ion-slide *ngFor="let item of list;">
+    <ion-slides (ionSlideDidChange)="slideChanged(e)">
+      <ion-slide *ngFor="let item of list;let i = index">
         <div class="learn-item">
-          <div class="learn-title">学习测试标题学习测试标题学习测试标题</div>
+          <div class="learn-title">{{title}}</div>
           <div class="item-container">
             <div class="item-title">
               <!--判断题目类型-->
                   <p>
-                    <span class="color-red" *ngIf="item.isAns == 1">*</span>{{index}}、
+                    <span class="color-red" *ngIf="item.isAns == 1">*</span>{{i +1}}、
                     <span *ngIf="item.questionType == 1">(单选)</span>
                     <span *ngIf="item.questionType == 2">(多选)</span>
                     <span *ngIf="item.questionType == 3">(填空)</span>
@@ -28,7 +28,7 @@
             <div class="ans-tips">
               <span *ngIf="item.result == 1" class="ans-green">回答正确</span>
               <span *ngIf="item.result == 0" class="ans-red">回答错误</span>
-              <span class="margin-left-20">您的答案：{{item.myAnswer}}</span>
+              <span *ngIf="item.questionType == 1 || item.questionType == 2 || item.questionType == 4" class="margin-left-20">您的答案：{{item.myAnswer}}</span>
             </div>
             <div class="item-content">
               <div class="padding-0-30">
@@ -50,7 +50,7 @@
                   <ng-container *ngFor=" let option2 of item.options;let quesIndex = index;">
                     <p>
                       <label>
-                        <input type="checkbox" (change)="mutiSelect(i,option2.option)" [value]="quesIndex" [name]="item.questionId">
+                        <input disabled type="checkbox" (change)="mutiSelect(i,option2.option)" [value]="quesIndex" [name]="item.questionId">
                         <span class="selectIndex" [ngClass]="{'select-right' : option2.answer == 'right',
                         'select-error':option2.answer == 'error'}">{{option2.option}}</span>&nbsp;&nbsp;
                         {{option2.comment}}
@@ -61,19 +61,22 @@
                 <!--填空-->
                 <ng-container *ngIf="item.questionType == 3">
                   <textarea disabled [(ngModel)]="item.myAnswer" class="content-textarea"></textarea>
+                  <div class="border  margin-top-20 padding-10">
+                    正确答案：{{item.correctAnswer}}
+                  </div>
                 </ng-container>
                 <!--判断题-->
                 <ng-container *ngIf="item.questionType == 4">
                   <p>
                     <label>
-                      <input [(ngModel)]="item.answer" [name]="item.questionQueId" value="A type="radio">
+                      <input disabled [(ngModel)]="item.answer" [name]="item.questionQueId" value="A" type="radio">
                       <span class=" selectIndex">A</span>&nbsp;&nbsp;
                       是
                     </label>
                   </p>
                   <p>
                     <label>
-                      <input [(ngModel)]="item.answer" [name]="item.questionQueId" value="B" type="radio">
+                      <input disabled [(ngModel)]="item.answer" [name]="item.questionQueId" value="B" type="radio">
                       <span class=" selectIndex">B</span>&nbsp;&nbsp;
                       否
                     </label>
@@ -81,7 +84,10 @@
                 </ng-container>
                 <!--问答-->
                 <ng-container *ngIf="item.questionType == 5">
-                  <textarea [(ngModel)]="item.answer" class="content-textarea"></textarea>
+                  <textarea [(ngModel)]="item.answer" disabled class="content-textarea"></textarea>
+                  <div class="border margin-top-20 padding-10">
+                    正确答案：{{item.correctAnswer}}
+                  </div>
                 </ng-container>
               </div>
             </div>
@@ -92,7 +98,7 @@
   </div>
   <div class="footer-subject">
     <div (click)="prev()" class="prev">上一题</div>
-    <div class="index">{{index}} / {{list.length}}</div>
+    <div class="index">{{index +1}} / {{list.length}}</div>
     <div (click)="next()" class="next">下一题</div>
   </div>
   <div class="footer-submit">

src/pages/home/learning/review-learn/review-learn.ts

@@ -13,8 +13,9 @@ import {LearnService} from "../learn.service";
 export class ReviewLearnPage {
     @ViewChild(Slides) slides: Slides;
 
+    title;   //测试标题
     list = [];
-    index = 1;  //当前题目的序号
+    index = 0;  //当前题目的序号
     score;   //得分
     constructor(public navCtrl: NavController, public navParams: NavParams,public learnSer:LearnService,
                 public toastCtrl:ToastController,public appService:AppService) {
@@ -23,6 +24,7 @@ export class ReviewLearnPage {
     ionViewDidLoad() {
         const recordId = this.navParams.get('recordId');
         this.score = this.navParams.get('score');
+        this.title = this.navParams.get('title');
         const data = {
             recordId:recordId,
         }
@@ -30,7 +32,7 @@ export class ReviewLearnPage {
             (res)=>{
                 this.list = res.data;
                 this.list.forEach(e=>{
-                    if(e.questionType == 1 || e.questionType == 2 || e.questionType == 4){
+                    if(e.questionType == 1 || e.questionType == 2){
                         e.options.forEach(s=>{
                             if(e.correctAnswer.includes(s.option)){
                                 s.answer = 'right';
@@ -42,32 +44,36 @@ export class ReviewLearnPage {
                         })
                     }
                 })
-                console.log(this.list);
             }
         )
     }
 
+    //左划右划
+    slideChanged(){
+        this.index = this.slides.getActiveIndex();
+    }
+
     //上一题
-    prev(){
-        if(this.index == 1){
+    prev() {
+        if (this.index == 0) {
             const toast = this.toastCtrl.create(message);
             toast.setMessage('已经是第一题哦');
             toast.present();
-        }else{
+        } else {
             this.index -= 1;
-            this.slides.slideTo(this.index-1)
+            this.slides.slideTo(this.index)
         }
     }
 
     //下一题
-    next(){
-        if(this.index == this.list.length){
+    next() {
+        if (this.index == this.list.length -1) {
             const toast = this.toastCtrl.create(message);
             toast.setMessage('已经是最后一题了哦');
             toast.present();
-        }else{
+        } else {
             this.index += 1;
-            this.slides.slideTo(this.index-1)
+            this.slides.slideTo(this.index)
         }
     }
 
@@ -83,5 +89,4 @@ export class ReviewLearnPage {
         });
         this.list = arr;
     }
-
 }

src/theme/icon.scss

@@ -42,6 +42,7 @@
 .color-24bafc{
     color: #24bafc;
 }
+.border{border: 1px solid #ddd;}
 @for $i from 0 through 101{
     .margin-right-#{$i}{
         margin-right: #{$i}px;