下拉刷新

src/pages/tabs/discover/discover.html

@@ -19,29 +19,34 @@
       </button>
     </ion-buttons>
   </ion-navbar>
-</ion-header>
-<div class="tabs-fixed">
-  <div class="scroll-tab">
-    <div class="news-content">
-      <div #tabsParent class="tabs-parent">
-        <div #tabsChildren *ngFor="let item of tabsList;" (click)="changeParent(item)" class="tabs-children">
-          <span #tabSpan [style.color]="indexParent == item.indexParent ? '#e12724':''">{{item.name}}</span>
+    <div class="tabs-fixed">
+      <div class="scroll-tab">
+        <div class="news-content">
+          <div #tabsParent class="tabs-parent">
+            <div #tabsChildren *ngFor="let item of tabsList;" (click)="changeParent(item)" class="tabs-children">
+              <span #tabSpan [style.color]="indexParent == item.indexParent ? '#e12724':''">{{item.name}}</span>
+            </div>
+            <span #tips id="tips"></span>
+          </div>
         </div>
-        <span #tips id="tips"></span>
       </div>
-    </div>
-  </div>
-  <div class="scroll-tab">
-    <div class="news-content" #newsContent>
-      <div class="tabs-parent">
-        <div class="tabs-child">
-          <span *ngFor="let ch of childrenList" [ngClass]="{'select':indexChildren == ch.indexChildren}" (click)="changeChildren(ch)">{{ch.name}}</span>
+      <div class="scroll-tab">
+        <div class="news-content" #newsContent>
+          <div class="tabs-parent">
+            <div class="tabs-child">
+              <span *ngFor="let ch of childrenList" [ngClass]="{'select':indexChildren == ch.indexChildren}" (click)="changeChildren(ch)">{{ch.name}}</span>
+            </div>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</div>
+</ion-header>
 <ion-content>
+  <ion-refresher (ionRefresh)="doRefresh($event)">
+    <ion-refresher-content pullingText="下拉刷新"
+                           refreshingSpinner="bubbles">
+    </ion-refresher-content>
+  </ion-refresher>
   <div class="search-content">
     <ng-container *ngFor="let item of newList">
       <div class="search-item" (click)="goToDetail(item)">
@@ -89,4 +94,8 @@
       </div>
     </ng-container>
   </div>
+
+  <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
+    <ion-infinite-scroll-content></ion-infinite-scroll-content>
+  </ion-infinite-scroll>
 </ion-content>

src/pages/tabs/discover/discover.scss

 page-discover {
+  background-color: #fff;
+  ion-content{
+    top: 100px;
+
+  }
   .toolbar .searchbar-ios .searchbar-input {
     background-color: #e12724;
     border-bottom: 1px solid #fff;
@@ -57,7 +62,6 @@ page-discover {
   //新闻区
   .search-content{
     padding: 0 1rem;
-    margin-top: 88px;
     .search-item{
       padding: .8rem 0;
       .item-info{
@@ -124,7 +128,7 @@ page-discover {
 
   .tabs-fixed{
     position: fixed;
-    top: 52px;
+    top: 44px;
     left: 0px;
     width: 100%;
     z-index: 99999;

src/pages/tabs/discover/discover.ts

@@ -7,6 +7,7 @@ import {PublishPage} from "../../discover-pages/publish/publish";
 import {EmitService} from "../../../provide/emit.service";
 import {NoticePage} from "../notice/notice";
 import {AppGlobal} from "../../../service/http.service";
+import {CommonService} from "../../../provide/common.service";
 
 
 @IonicPage()
@@ -133,6 +134,7 @@ export class DiscoverPage {
         {"name": "知识拓展", "type": -1, "indexParent": 4, "children": []}
     ];
     childrenList = [];
+    plateType;   //分类
 
     indexParent = 1;
     indexChildren = 0;
@@ -141,6 +143,7 @@ export class DiscoverPage {
     picture: string = AppGlobal.domain + '/wisdomgroup';
 
     constructor(public navCtrl: NavController, public navParams: NavParams,
+                public commonSer:CommonService,
                 public tabsSer: TabsService, public emitSer: EmitService) {
         // 接收发射过来的数据
         this.emitSer.eventEmit.subscribe((value: any) => {
@@ -159,6 +162,7 @@ export class DiscoverPage {
         this.newsContent.nativeElement.scrollLeft = 0;   //二级菜单滑动重置
         const index = item.indexParent;
         this.indexParent = index;
+        this.plateType = item.type;
         this.childrenList = item.children;
         if(this.childrenList.length > 0) this.indexChildren = this.childrenList[0].indexChildren;
         let itemWidth = window.screen.width / 4;
@@ -170,7 +174,7 @@ export class DiscoverPage {
             pageSize: 1,
             pageCount: 100,
             obj: {
-                'plateType': item.type,
+                'plateType': this.plateType,
                 'resourceType': 1
             }
         };
@@ -232,4 +236,31 @@ export class DiscoverPage {
         this.navCtrl.push(NoticePage);
     }
 
+    doRefresh(e){
+        const data = {
+            pageSize: 1,
+            pageCount: 100,
+            obj: {
+                'plateType': this.plateType,
+                'resourceType': 1
+            }
+        };
+        this.tabsSer.stuffPage(data).subscribe(
+            (res) => {
+                this.newList = res.data;
+                this.newList.forEach(e => {
+                    if (e.attachments.length > 0) {
+                        e.imgUrl = e.attachments[0].path;
+                    }
+                })
+                this.commonSer.toastTime('刷新成功!',800)
+                e.complete();
+            }
+        )
+    }
+
+    doInfinite(e){
+        e.complete();
+    }
+
 }

src/pages/tabs/home/home.html

@@ -70,6 +70,12 @@
     </div>
 
     <div class="main-news">
+        <ion-refresher (ionRefresh)="doRefresh($event)">
+            <ion-refresher-content pullingText="下拉刷新"
+            pullingIcon="arrow-dropdown"
+            refreshingSpinner="bubbles">
+            </ion-refresher-content>
+        </ion-refresher>
         <ng-container *ngFor="let new of newList;">
             <ng-container *ngIf="new.imgUrl">
                 <ion-row class="news-item" (click)="goToDetail(new)">
@@ -97,6 +103,9 @@
                 </ion-row>
             </ng-container>
         </ng-container>
+        <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
+            <ion-infinite-scroll-content></ion-infinite-scroll-content>
+        </ion-infinite-scroll>
     </div>
 </ion-content>
 <!--政治生日-->

src/pages/tabs/home/home.ts

@@ -155,8 +155,6 @@ export class HomePage {
         })
     }
 
-
-
     //关闭弹窗 开启跑马灯
     start() {
         const nowDay = this.datePipe.transform( new Date(),'yyyy-MM-dd' );
@@ -258,4 +256,12 @@ export class HomePage {
         this.navCtrl.push(NoticePage);
     }
 
+    doInfinite(e){
+        e.complete();
+    }
+
+    doRefresh(e){
+      e.complete();
+    }
+
 }

src/provide/common.service.ts

@@ -60,6 +60,16 @@ export class CommonService{
         }
     }
 
+    //短暂提示提示
+    toastTime(message,duration) {
+        let toast = this.toastCtrl.create({
+            message: message,
+            duration: duration,
+            position:'middle',
+            dismissOnPageChange: true,
+        });
+        toast.present();
+    }
     /**
      * alert弹窗
      * @param message  弹窗内的文字