tab4

src/app/app-routing.module.ts

@@ -40,7 +40,11 @@ const routes: Routes = [
     {
       path: 'user',
       loadChildren: () => import('../modules/user/user.module').then(m => m.UserModule)
-    }
+    },
+  {
+    path: 'following',
+    loadChildren: () => import('./following/following.module').then( m => m.FollowingPageModule)
+  }
 
   
 

src/app/following/following-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { FollowingPage } from './following.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: FollowingPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class FollowingPageRoutingModule {}

src/app/following/following.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { FollowingPageRoutingModule } from './following-routing.module';
+
+import { FollowingPage } from './following.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    FollowingPageRoutingModule
+  ],
+  declarations: [FollowingPage]
+})
+export class FollowingPageModule {}

src/app/following/following.page.html

@@ -0,0 +1,13 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>following</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">关注</ion-title>
+    </ion-toolbar>
+  </ion-header>
+</ion-content>

src/app/following/following.page.spec.ts

@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { FollowingPage } from './following.page';
+
+describe('FollowingPage', () => {
+  let component: FollowingPage;
+  let fixture: ComponentFixture<FollowingPage>;
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(FollowingPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/following/following.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-following',
+  templateUrl: './following.page.html',
+  styleUrls: ['./following.page.scss'],
+})
+export class FollowingPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/tab4/tab4.page.html

@@ -43,7 +43,7 @@
     <ion-grid>
   <ion-row>
     <ion-col size="4">
-      <p class="count">{{user.following}}</p>
+      <p class="count" (click)="openFollowingPage()">{{user.following}}</p>
       <p class="label">关注</p>
     </ion-col>
     <ion-col size="4">

src/app/tab4/tab4.page.ts

@@ -76,6 +76,11 @@ export class Tab4Page implements OnInit {
     this.navCtrl.navigateForward('../../modules/user/login/login.module');
   }
 
+  openFollowingPage(){
+    //打开关注页面
+    this.router.navigate(['/following']);
+  }
+
   // 由于Parse.User.current()是随着localStorage变化的属性
   // 为了避免首次复制后用户状态变化，页面不同步，通过get方法实现实时获取
   // user:Parse.User|undefined