Angular用户指令不起作用

时间:2018-03-20 04:38:53

标签: angular ionic2

我正在加载指令' user'应用内模块。当有人点击用户时我想提醒你好世界。它在家用控制器中像魅力一样工作,但它不适用于类别控制器。

你能告诉我如何解决这个问题?为什么会出现这个问题?请注意,类别模块和任何其他模块都没有任何错误。

指令:

import { Directive, HostListener } from '@angular/core';
import { NavController } from 'ionic-angular';
import { ActionSheetController } from 'ionic-angular';
@Directive({
  selector: '[user]' // Attribute selector
})
export class UserDirective {

  constructor(public navCtrl: NavController, public actionSheetCtrl: ActionSheetController) {
  }

  @HostListener('click') onClick() {
    alert('Hello world!);
  }

}

应用模块:

import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule, IonicPageModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { UserDirective } from '../directives/user/user';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    UserDirective
  ],
  imports: [
    BrowserModule,
    HttpModule,
    IonicModule.forRoot(MyApp),
    IonicPageModule.forChild(HomePage),
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
  ]
})
export class AppModule {}

控制器:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

/**
 * Generated class for the CategoriesPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-categories',
  templateUrl: 'categories.html',
})
export class CategoriesPage {

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

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

}

查看:

<ion-segment [(ngModel)]="segment" color="primary" *ngIf="this.Loader != 1">
  <ion-segment-button value="Home" (click)="page_redirect('HomePage')" text-center>
    Home
  </ion-segment-button>
  <ion-segment-button value="Featured" (click)="page_redirect('FeaturedItemPage')" text-center>
    Featured
  </ion-segment-button>
  <ion-segment-button value="Category" (click)="page_redirect('CategoriesPage')" text-center>
    Category
  </ion-segment-button>
  <ion-segment-button value="User" user text-center>
    User
  </ion-segment-button>
</ion-segment>

0 个答案:

没有答案