Onclick图像移动另一页不起作用

时间:2017-06-01 06:12:52

标签: angular2-routing nativescript angular2-nativescript

  • 我是nativescript的新手。我从Alert页面导航到 Naviagation页面。我已经发布了所有相关的代码。请检查一下。

  • 我没有遇到任何问题。当执行图片onClick时,我可以调用此方法onNotification()

  • 我能够在命令提示符下看到此控制台日志

    console.log("SteveCheck", "Test");

  • 但我不知道,为什么它何时没有转移到通知页面 点击提醒页面中的按钮。我已添加了所有相关代码。

app.module.ts:

import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptModule } from "nativescript-angular/nativescript.module";
import { AlertComponent } from "./AlertFolder/alert.component";


import { NativeScriptRouterModule } from "nativescript-angular/router"
import {AppRoutes, AppComponents } from "./app.routing";

@NgModule({
  declarations: [AlertComponent, ...AppComponents],
  bootstrap: [AlertComponent],
  imports: [
    NativeScriptModule,
    NativeScriptRouterModule,
    NativeScriptRouterModule.forRoot(AppRoutes)
    ],

  schemas: [NO_ERRORS_SCHEMA],
})

export class AppModule {}

app.routing.ts:

import { AlertComponent } from "./AlertFolder/alert.component";
import { NotificationComponent } from "./Noficiation/notification";

export const AppRoutes:any = [ 

    { path: "", component: AlertComponent },
    { path: "NotificationPage", component: NotificationComponent}
];

export const AppComponents: any = [ 

 AlertComponent,
 NotificationComponent

];

alert.component.ts:

 @Component({
 selector: "sdk-child-component",
 moduleId: module.id,
 ....
 })

export class AlertComponent   {

.....
.....
 public constructor(private router: Router, private routerExtensions: RouterExtensions){

this.alertList = [];
}


onNotification() {

     console.log("SteveCheck", "Test");
     this.router.navigate(["NotificationPage"]);

}

 }

alert.component.html:

 <StackLayout class="borders" orientation="horizontal" >
    <Label class="notification-label" text="Notification Center" ></Label>
    <Image src="res://right_arrow" stretch="none" class="right-arrow" (tap)="onNotification()"></Image>

  </StackLayout>

3 个答案:

答案 0 :(得分:1)

using static System.Console;

答案 1 :(得分:0)

我必须使用Path文件夹名称Notification。我将第二页NotificationComponent放在Notification文件夹中。这就是为什么我无法在页面之间导航的原因。

通过更改:

  this.router.navigate(["NotificationPage"]);

到此:

this.router.navigate(["Notification"]);

解决了我的问题

答案 2 :(得分:0)

这里是一个示例,我们可以在img标签上包含routerLink-

 <img src="../../../assets/images/Notification.png" [routerLink]="['/NotificationPage']" width="55%" height = "200px" class="img-responsive" style="margin-left: 220px">