左滑

src/components/components.module.ts

-import { NgModule } from '@angular/core';
-import { SlideComponent } from './slide/slide';
+import {NgModule} from '@angular/core';
+import {SlideComponent} from './slide/slide';
 import {IonicPageModule} from "ionic-angular";
-import { SlideListComponent } from './slide-list/slide-list';
+import {SlideListComponent} from './slide-list/slide-list';
+
 @NgModule({
-	declarations: [SlideComponent,
-    SlideListComponent,
+    declarations: [SlideComponent,
+        SlideListComponent,
 
     ],
-	imports: [
-		IonicPageModule
-	],
-	exports: [SlideComponent,
-    SlideListComponent,
-
+    imports: [
+        IonicPageModule
+    ],
+    exports: [SlideComponent,
+        SlideListComponent,
     ],
-	providers:[
-		SlideComponent,
-	]
+    providers: [
+        SlideComponent,
+        SlideListComponent,
+    ]
 })
-export class ComponentsModule {}
+export class ComponentsModule {
+}

src/components/slide-list/slide-list.html

+<!--true 隐藏 false 显示-->
 <div [hidden]="isScroll" class="news-content">
   <div class="tabs-parent">
     <div *ngFor="let item of tabsList;let i = index" (click)="change(item)" class="tabs-children">
@@ -7,6 +8,7 @@
   </div>
 </div>
 
+<!--固定 false -->
 <div [hidden]="!isScroll" ion-fixed class="news-content ion-fixed">
   <div class="tabs-parent">
     <div *ngFor="let item of tabsList;let i = index" (click)="change(item)" class="tabs-children">

src/components/slide-list/slide-list.ts

-import {AfterViewInit, Component, ElementRef, ViewChild} from '@angular/core';
-import {Slides} from "ionic-angular";
+import {AfterViewInit, Component, ElementRef, NgZone, ViewChild} from '@angular/core';
+import {Content, Slides} from "ionic-angular";
 import {TabsService} from "../../pages/tabs/tabs.service";
 import {AppGlobal} from "../../service/http.service";
 
 @Component({
-  selector: 'slide-list',
-  templateUrl: 'slide-list.html'
+    selector: 'slide-list',
+    templateUrl: 'slide-list.html'
 })
-export class SlideListComponent implements AfterViewInit{
-  @ViewChild(Slides) slides:Slides;
-  @ViewChild('tabSpan') tabSpan:ElementRef;
-  @ViewChild('tips') tips:ElementRef;
-  @ViewChild('tips1') tips1:ElementRef;
+export class SlideListComponent implements AfterViewInit {
+    @ViewChild(Slides) slides1: Slides;
+    @ViewChild('tabSpan') tabSpan: ElementRef;
+    @ViewChild('tips') tips: ElementRef;
+    @ViewChild('tips1') tips1: ElementRef;
 
-  isScroll = false;
-  //所属板块类型:
-  //1党章党规,2系列讲话,3中央精神,4本市部署,5通知公告,6党建动态,7工作提示,8党务参考
-  //9廉政格言,10纪检提示,11风险排查,12警示教育,13支部活动,14党建联建,15结对帮扶
-  tabsList = [
-    {name: "系列讲话", type: 2, index: 0},
-    {name: "党章党规", type: 1, index: 1},
-    {name: "中央精神", type: 3, index: 2},
-    {name: "本市部署", type: 4, index: 3}
-  ];
-  index = 0;
-  slideList = [];
-  picture: string = AppGlobal.domain + '/wisdomgroup';
+    isScroll = false;
+    //所属板块类型:
+    //1党章党规,2系列讲话,3中央精神,4本市部署,5通知公告,6党建动态,7工作提示,8党务参考
+    //9廉政格言,10纪检提示,11风险排查,12警示教育,13支部活动,14党建联建,15结对帮扶
+    tabsList = [
+        {name: "系列讲话", type: 2, index: 0},
+        {name: "党章党规", type: 1, index: 1},
+        {name: "中央精神", type: 3, index: 2},
+        {name: "本市部署", type: 4, index: 3}
+    ];
+    index = 0;
+    slideList = [];
+    picture: string = AppGlobal.domain + '/wisdomgroup';
 
 
+    constructor(private tabsSer: TabsService,public zone:NgZone) {
+        this.slideList.length = 4;
+    }
 
-  constructor(private tabsSer:TabsService) {
-    this.slideList.length = 4;
-    console.log('Hello SlideListComponent Component');
-  }
-
-  ngAfterViewInit(): void {
-    this.change(this.tabsList[0]);
-  }
-
-  change(item) {
-    const index = item.index;
-    let itemWidth = window.screen.width / 4;
-    let spanWidth = this.tabSpan.nativeElement.offsetWidth;   //文字宽度
-    this.tips.nativeElement.style.width = this.tabSpan.nativeElement.offsetWidth + 'px';
-    this.tips1.nativeElement.style.width = this.tabSpan.nativeElement.offsetWidth + 'px';
-    // 自身div的一半 - 滑块的一半
-    this.tips.nativeElement.style.left = itemWidth * (index) + (itemWidth - spanWidth) / 2 + 'px';
-    this.tips1.nativeElement.style.left = itemWidth * (index) + (itemWidth - spanWidth) / 2 + 'px';
-    this.index = index;
-    const data = {
-      pageSize: 1,
-      pageCount: 100,
-      obj: {
-        'plateType': item.type,
-        'resourceType': 1
-      }
+    ngAfterViewInit(): void {
+        this.change(this.tabsList[0]);
     }
-    this.tabsSer.stuffPage(data).subscribe(
-        (res) => {
-          let arr =  res.data;
-          arr.forEach(e => {
-            if (e.attachments.length > 0) {
-              e.imgUrl = e.attachments[0].path;
+
+    change(item) {
+        const index = item.index;
+        let itemWidth = window.screen.width / 4;
+        let spanWidth = this.tabSpan.nativeElement.offsetWidth;   //文字宽度
+        this.tips.nativeElement.style.width = this.tabSpan.nativeElement.offsetWidth + 'px';
+        this.tips1.nativeElement.style.width = this.tabSpan.nativeElement.offsetWidth + 'px';
+        // 自身div的一半 - 滑块的一半
+        this.tips.nativeElement.style.left = itemWidth * (index) + (itemWidth - spanWidth) / 2 + 'px';
+        this.tips1.nativeElement.style.left = itemWidth * (index) + (itemWidth - spanWidth) / 2 + 'px';
+        this.index = index;
+        const data = {
+            pageSize: 1,
+            pageCount: 100,
+            obj: {
+                'plateType': item.type,
+                'resourceType': 1
             }
-          })
-          this.slides.slideTo(index,500);
-          this.slideList[index] = arr;
         }
-    )
-  }
+        this.tabsSer.stuffPage(data).subscribe(
+            (res) => {
+                let arr = res.data;
+                arr.forEach(e => {
+                    if (e.attachments.length > 0) {
+                        e.imgUrl = e.attachments[0].path;
+                    }
+                })
+                this.slides1.slideTo(index, 500);
+                this.slideList[index] = arr;
+            }
+        )
+    }
 
-  slideChange(e){
-    const index = this.slides.getActiveIndex();
-    // console.log(this.tabsList[index]);
-    // this.changeParent(this.tabsList[index])
-  }
+    slideChange(e) {
+        const index = this.slides1.getActiveIndex();
+        this.change(this.tabsList[index])
+    }
 
-  //
-  goToDetail(item){}
+    //判断是否scroll  true 滑动  false  不滑动
+    scroll(bool) {
+        this.isScroll = bool !== 'false';
+        console.log(this.isScroll)
+    }
+
+    //
+    goToDetail(item) {
+    }
 
 }

src/components/slide/slide.html

 <div class="slides-content">
-  <ion-slides (ionSlideDidChange)="slideChange($event)" #slides *ngIf="slidersItems.length>0" pager
-              loop="true"
-              autoplay="2000" speed="1500">
-    <ion-slide *ngFor="let item of slidersItems;">
-      <img src="{{picture+item.imgUrl}}" class="slide-image" (click)="goToDetail(item)">
-    </ion-slide>
-  </ion-slides>
+    <ion-slides (ionSlideDidChange)="slideChange($event)" #slides *ngIf="slidersItems.length>0" pager
+                loop="true"
+                autoplay="2000" speed="1500">
+        <ion-slide *ngFor="let item of slidersItems;">
+            <img src="{{picture+item.imgUrl}}" class="slide-image" (click)="goToDetail(item)">
+        </ion-slide>
+    </ion-slides>
 </div>
-<p class="slides-title">{{slideTitle}} <span class="main-color" float-end>1<span
+<p class="slides-title">
+    {{slideTitle}} <span class="main-color" float-end>1<span
         style="font-size: 1.5rem;font-weight: 400;">/{{slidersItems.length}}</span></span></p>
\ No newline at end of file

src/pages/tabs/home/home.ts

@@ -12,6 +12,7 @@ import {SearchNewPage} from "../../home-pages/search-new/search-new";
 import {StuffDetailPage} from "../../home-pages/stuff-detail/stuff-detail";
 import {EmitService} from "../../../provide/emit.service";
 import {DatePipe} from "@angular/common";
+import {SlideListComponent} from "../../../components/slide-list/slide-list";
 
 @IonicPage()
 @Component({
@@ -61,7 +62,7 @@ export class HomePage {
 
     constructor(public navCtrl: NavController, public tts: TextToSpeech, public datePipe: DatePipe,
                 public commonSer: CommonService, public emitSer: EmitService,
-                public zone: NgZone,public renderer:Renderer2,
+                public zone: NgZone,public slideList:SlideListComponent,
                 public appService: AppService, public http: Http, public storage: Storage,
                 public badge: Badge, public tabsSer: TabsService) {
         // 接收发射过来的数据
@@ -85,15 +86,17 @@ export class HomePage {
         this.getInfo();
         this.scrollHeight();
     }
+
+
     scrollHeight(){
         const height = this.topHeight.nativeElement.offsetHeight + 80;
         this.content.ionScroll.subscribe(($event)=>{
             this.zone.run(()=>{
                 // this.headerTag.nativeElement.
                 if(this.content.scrollTop > height){
-                    this.isScroll = true;
+                    this.slideList.scroll('true');
                 }else{
-                    this.isScroll = false;
+                    this.slideList.scroll('false');
                 }
                 this.content.resize();
             })