jjzjj

javascript - Ionic Framework - 尝试推送页面时未定义 'nav'

coder 2023-12-22 原文

我正在尝试使用 Ionic 框架制作一个 Android 应用程序。我实现了一个侧面菜单，当我尝试从侧面菜单推送页面时，我在控制台中收到一条错误消息:

Cannot read property 'push' of undefined

app.ts

import { Component, ViewChild } from '@angular/core';
import { ModalController, ionicBootstrap, Platform, MenuController, NavController } from 'ionic-angular';
import { StatusBar } from 'ionic-native';

import { HomePage } from './pages/home/home';
import {AppSettingsPage} from "./pages/app-settings/app-settings";
import {TabsPage} from "./pages/tabs/tabs";
import {ReserveRoomPage} from "./pages/reserve-room/reserve-room";
import {ConfirmedReservationsPage} from "./pages/confirmed-reservations/confirmed-reservations";


@Component({
  templateUrl: 'build/app.html',
  providers: [NavController]
})
export class MyApp {
  @ViewChild('nav') nav: NavController;
  private rootPage: any;
  private pages: any[];
  private icon = 'cog';

  constructor(private platform: Platform, private menu: MenuController,
  private modalCtrl: ModalController) {
  this.menu = menu;
    this.pages = [
      {title: 'Home', component: HomePage, icon: 'home'},
      {title: 'Settings', component: AppSettingsPage, icon: 'settings'},
      {title: 'Reserve Room', component: ReserveRoomPage, icon: 'add'},
      {title: 'My Reservations', component: ConfirmedReservationsPage, icon: 'book'},
    ];
    this.rootPage = TabsPage;

    platform.ready().then(() => {
      StatusBar.styleDefault();
    });
  }

  openPage(page){
    this.menu.close();
    this.nav.push(page.component);
  }

}

ionicBootstrap(MyApp);

app.html

<ion-menu [content] = "content">
  <ion-toolbar>
    <ion-title><strong>Giman</strong>.lk</ion-title>
  </ion-toolbar>
  <ion-content>
    <ion-list>
      <button ion-item *ngFor="let p of pages" (click)="openPage(p)">
        <ion-icon name="{{ p.icon }}"></ion-icon> {{ p.title }}
      </button>
    </ion-list>
  </ion-content>
</ion-menu>

<ion-nav id="nav" [root]="rootPage" #content swipe-back-enabled="false"></ion-nav>

app-settings.ts(我要推送的页面示例)

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

@Component({
  templateUrl: 'build/pages/app-settings/app-settings.html',
})
export class AppSettingsPage {

  constructor(private navCtrl: NavController, private view: ViewController) {

  }
  goBack(){
    this.view.dismiss();
  }

}

(我导入了 ModalController，因为我想预览我的 App UI 流程，并且因为推送不起作用，我将每个页面用作模式只是为了预览目的。对于最终的应用程序，我需要推送和弹出)

最佳答案

将 @ViewChild 设置为 NavController 但设置为 Nav。

import { Nav } from 'ionic-angular';

.....

@Component({
  templateUrl: "build/app.html" //no need for the provider
})

class MyApp{
  @ViewChild(Nav) nav:Nav; //remove the 'id' from the HTML, it will find the ion-nav tag
  ....
  someFunction(){
    this.nav.push(YourComponent);
    //or
    this.nav.setRoot(YourComponent); 
  }
}

关于javascript - Ionic Framework - 尝试推送页面时未定义 'nav'，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39694775/

未定javascript39importcodeandroidionic-frameworkionic2

有关javascript - Ionic Framework - 尝试推送页面时未定义 'nav'的更多相关文章

  1. ruby - Facter::Util::Uptime:Module 的未定义方法 get_uptime (NoMethodError) - 2

    我正在尝试设置一个puppet节点，但ruby​​gems似乎不正常。如果我通过它自己的二进制文件(/usr/lib/ruby/gems/1.8/gems/facter-1.5.8/bin/facter)在cli上运行facter，它工作正常，但如果我通过由ruby​​gems(/usr/bin/facter)安装的二进制文件，它抛出:/usr/lib/ruby/1.8/facter/uptime.rb:11:undefinedmethod`get_uptime'forFacter::Util::Uptime:Module(NoMethodError)from/usr/lib/ruby

  2. ruby-on-rails - rails : "missing partial" when calling 'render' in RSpec test - 2

    我正在尝试测试是否存在表单。我是Rails新手。我的new.html.erb_spec.rb文件的内容是:require'spec_helper'describe"messages/new.html.erb"doit"shouldrendertheform"dorender'/messages/new.html.erb'reponse.shouldhave_form_putting_to(@message)with_submit_buttonendendView本身，new.html.erb，有代码:当我运行rspec时，它失败了:1)messages/new.html.erbshou

  3. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

    我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗？当我运行compasswatch时，它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行？文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们？我自己编译的.sass文件编译成compiled/t

  4. ruby - ECONNRESET (Whois::ConnectionError) - 尝试在 Ruby 中查询 Whois 时出错 - 2

    我正在用Ruby编写一个简单的程序来检查域列表是否被占用。基本上它循环遍历列表，并使用以下函数进行检查。require'rubygems'require'whois'defcheck_domain(domain)c=Whois::Client.newc.query("google.com").available?end程序不断出错(即使我在google.com中进行硬编码)，并打印以下消息。鉴于该程序非常简单，我已经没有什么想法了-有什么建议吗？/Library/Ruby/Gems/1.8/gems/whois-2.0.2/lib/whois/server/adapters/base.

  5. ruby-on-rails - Rails 3.2.1 中 ActionMailer 中的未定义方法 'default_content_type=' - 2

    我在我的项目中添加了一个系统来重置用户密码并通过电子邮件将密码发送给他，以防他忘记密码。昨天它运行良好(当我实现它时)。当我今天尝试启动服务器时，出现以下错误。=>BootingWEBrick=>Rails3.2.1applicationstartingindevelopmentonhttp://0.0.0.0:3000=>Callwith-dtodetach=>Ctrl-CtoshutdownserverExiting/Users/vinayshenoy/.rvm/gems/ruby-1.9.3-p0/gems/actionmailer-3.2.1/lib/action_mailer

  6. ruby - 在 jRuby 中使用 'fork' 生成进程的替代方案？ - 2

    在MRIRuby中我可以这样做:deftransferinternal_server=self.init_serverpid=forkdointernal_server.runend#Maketheserverprocessrunindependently.Process.detach(pid)internal_client=self.init_client#Dootherstuffwithconnectingtointernal_server...internal_client.post('somedata')ensure#KillserverProcess.kill('KILL',

  7. ruby-on-rails - form_for 中不在模型中的自定义字段 - 2

    我想向我的Controller传递一个参数，它是一个简单的复选框，但我不知道如何在模型的form_for中引入它，这是我的观点:{:id=>'go_finance'}do|f|%>Transferirde:para:Entrada:"input",:placeholder=>"Quantofoiganho?"%>Saída:"output",:placeholder=>"Quantofoigasto?"%>Nota:我想做一个额外的复选框，但我该怎么做，模型中没有一个对象，而是一个要检查的对象，以便在Controller中创建一个ifelse，如果没有检查，请帮助我，非常感谢,谢谢

  8. ruby - 主要 :Object when running build from sublime 的未定义方法 `require_relative' - 2

    我已经从我的命令行中获得了一切，所以我可以运行rubymyfile并且它可以正常工作。但是当我尝试从sublime中运行它时，我得到了undefinedmethod`require_relative'formain:Object有人知道我的sublime设置中缺少什么吗？我正在使用OSX并安装了rvm。 最佳答案 或者，您可以只使用“require”，它应该可以正常工作。我认为“require_relative”仅适用于ruby​​1.9+ 关于ruby-主要:Objectwhenrun

  9. ruby - 无法让 RSpec 工作—— 'require' : cannot load such file - 2

    我花了三天的时间用头撞墙，试图弄清楚为什么简单的“rake”不能通过我的规范文件。如果您遇到这种情况:任何文件夹路径中都不要有空格!。严重地。事实上，从现在开始，您命名的任何内容都没有空格。这是我的控制台输出:(在/Users/*****/Desktop/LearningRuby/learn_ruby)$rake/Users/*******/Desktop/LearningRuby/learn_ruby/00_hello/hello_spec.rb:116:in`require':cannotloadsuchfile--hello(LoadError) 最佳

  10. ruby-on-rails - 新 Rails 项目 : 'bundle install' can't install rails in gemfile - 2

    我已经像这样安装了一个新的Rails项目:$railsnewsite它执行并到达:bundleinstall但是当它似乎尝试安装依赖项时我得到了这个错误Gem::Ext::BuildError:ERROR:Failedtobuildgemnativeextension./System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/bin/rubyextconf.rbcheckingforlibkern/OSAtomic.h...yescreatingMakefilemake"DESTDIR="cleanmake"DESTDIR="

随机推荐