Question

我必须在ionic 3应用程序中实现可滑动片段。

我正在使用 https://github.com/siddhartha-gupta/ionic-3-swipe-able-segments/tree/develop/src/pages 指令，但出现以下错误：

<ion-content padding>
 <div [ngSwitch]="category" swipeSegment [tabsList]="categories" 
[ERROR ->][(currentTab)]="category" 
 (tabChanged)="onTabChanged($event)" class="swipe-area">
 <ion-list *ngSw"): 
ng:///InvitefriendPageModule/InvitefriendPage.html@60:66
Error: Template parse errors:
Can't bind to 'tabsList' since it isn't a known property of 'div'. ("

<ion-content padding>
 <div [ngSwitch]="category" swipeSegment [ERROR ->] . 
[tabsList]="categories" [(currentTab)]="category" 
(tabChanged)="onTabChanged($event)" class="swipe-ar"): 
ng:///InvitefriendPageModule/InvitefriendPage.html@60:42
Can't bind to 'currentTab' since it isn't a known property of 'div'. 
("

我的代码是：

在app.module.ts中：

import { SwipeSegmentDirective } from '../directives/swipe- segment.directive';

@NgModule({
 declarations: [
  MyApp,
  SwipeSegmentDirective
  // ProgressBarComponent
],

在Invitationfriend.ts中：

export class InvitefriendPage {

public category: string = 'everyone';
public categories: Array<string> = ['everyone', 'group', 'contact', 
'directory']

// tab1Root: any = "EveryonePage";
// tab2Root: any = "GroupPage";
// tab3Root: any = "ContactPage";
// tab4Root: any = "DirectoryPage";
// public categories: Array<string> = ['everyone', 'group', 'contact', 
'directory']

 constructor(public navCtrl: NavController, public navParams: 
  NavParams) {
 }

 ionViewDidLoad() {
  console.log('ionViewDidLoad InvitefriendPage');
 }

 onTabChanged(tabName) {
  this.category = tabName;
 }

在Invitationfriend.html中：

<ion-header>
 <ion-navbar color="danger">   

    <ion-toolbar class="toolbar-color myToolbar">
     <ion-segment [(ngModel)]="category" class="tabsSeg">

      <ion-segment-button value="everyone" class="segBtn tabname 
        active activated">
         Everyone
      </ion-segment-button>
      <ion-segment-button value="group" class="segBtn tabname">
        Group
      </ion-segment-button>
      <ion-segment-button value="contact" class="segBtn tabname">
        Contact
      </ion-segment-button>
      <ion-segment-button value="directory" class="segBtn tabname">
        Directory
      </ion-segment-button>
    </ion-segment>
   </ion-toolbar>
  </ion-navbar>

 </ion-header> 


<ion-content padding>
 <div [ngSwitch]="category" swipeSegment [tabsList]="categories" 
  [(currentTab)]="category" (tabChanged)="onTabChanged($event)" 
   class="swipe-area">
  <ion-list *ngSwitchCase="'everyone'">
   <ion-item>
    Batman Begins
   </ion-item>
   <ion-item>
    Transporter
   </ion-item>
   <ion-item>
    Million Dollar Baby
   </ion-item>
 </ion-list>

 <ion-list *ngSwitchCase="'group'">
  <ion-item>
    Game of Thrones
  </ion-item>
  <ion-item>
    Daredevil
  </ion-item>
  <ion-item>
    Arrow
  </ion-item>
</ion-list>

<ion-list *ngSwitchCase="'contact'">
  <ion-item>
    Ice Age
  </ion-item>
  <ion-item>
    Lion King
  </ion-item>
  <ion-item>
    Up
  </ion-item>
 </ion-list>

 <ion-list *ngSwitchCase="'directory'">
   <ion-item>
    Ice Age1
   </ion-item>
   <ion-item>
    Lion King1
   </ion-item>
   <ion-item>
    Up1
   </ion-item>
  </ion-list>
 </div>
</ion-content>

我需要任何解决方案来解决上述错误，请尽快在此处提供解决方案，我们将不胜感激。

如何在ionic 3中实现可滑动片段？

0 个答案: