离子2 +角度2-选项卡+侧面菜单

简单的

我试图将选项卡和侧面菜单结合在一起,但我对自己做错的事情感到困惑。因为root属于sidemenu ..

import {App, IonicApp, Platform} from 'ionic-framework/ionic';

import {HelloIonicPage} from './pages/hello-ionic/hello-ionic';
import {ListPage} from './pages/list/list';
import {TabsPage} from './pages/tabs/tabs';


// https://angular.io/docs/ts/latest/api/core/Type-interface.html
import {Type} from 'angular2/core';


@App({
  templateUrl: 'build/app.html',
  config: {} // http://ionicframework.com/docs/v2/api/config/Config/
})
class MyApp {
  // make HelloIonicPage the root (or first) page
  rootPage: Type = HelloIonicPage;
  pages: Array<{title: string, component: Type}>;

  constructor(private app: IonicApp, private platform: Platform) {

    this.initializeApp();

    // set our app's pages
    this.pages = [
      { title: 'Hello Ionic', component: HelloIonicPage },
      { title: 'My First List', component: ListPage },
      { title: 'testing tabs', component: TabsPage}
    ];
  }

  initializeApp() {
    this.platform.ready().then(() => {
      // The platform is now ready. Note: if this callback fails to fire, follow
      // the Troubleshooting guide for a number of possible solutions:
      //
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      //
      // First, let's hide the keyboard accessory bar (only works natively) since
      // that's a better default:
      //
      // Keyboard.setAccessoryBarVisible(false);
      //
      // For example, we might change the StatusBar color. This one below is
      // good for dark backgrounds and light text:
      // StatusBar.setStyle(StatusBar.LIGHT_CONTENT)
    });
  }

  openPage(page) {
    // close the menu when clicking a link from the menu
    this.app.getComponent('leftMenu').close();
    // navigate to the new page if it is not the current page
    let nav = this.app.getComponent('nav');
    nav.setRoot(page.component);
  }
}

我是ionic的新手,并且遵循以下教程http://ionicframework.com/docs/v2/getting-started/tutorial/

它具有选项卡或侧面菜单,但没有两者。我已经导入了标签,但是我不确定下一步要做什么,因为rootPage属于HelloIonicPage,我不想更改。

赛义德·塔里克(Syed Tariq)

尚不清楚为什么您需要执行此操作,但是有可能并且附加的链接中包含将模板生成的两个程序合并在一起的代码。生成的程序使用tab1页面作为“入门”页面。每个选项卡页面都提供侧边栏菜单。

  1. 我将“ tabs”程序的pages文件夹中的文件夹复制到了“ sidemenu”程序。

  2. 从“入门”中,我复制了导航条形码和侧栏菜单。这似乎由选项卡2和选项卡3页面继承,包括指定的标题(不确定原因)。因此,我在每个页面中添加了一个带有tab2和tab3标题的h1,作为标记。

  3. 我修改了app.ts文件,以导入在步骤1中添加的页面。

  4. 我添加了import语句来导入app.core.scss中的page1,page2和page3 html文件

该方法可以允许在侧栏上添加登录屏幕和其他实用程序屏幕(例如搜索)。

ionic 2中合并的Sidemenu和Tabs代码

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

离子2 +角度2-选项卡+侧面菜单

来自分类Dev

离子性侧面菜单和带有嵌套视图的选项卡:选项卡嵌套视图的内容未显示

来自分类Dev

LibGDX如何实现场景2D菜单选项卡?

来自分类Dev

LibGDX如何实现场景2D菜单选项卡?

来自分类Dev

在Ionic 2中,如何在单击另一个选项卡菜单应用程序图标时隐藏一个选项卡?

来自分类Dev

角度下拉菜单和选项卡的问题

来自分类Dev

角度下拉菜单和选项卡的问题

来自分类Dev

禁用滑动以查看侧面菜单2

来自分类Dev

在Ionic 2中将数据从子选项卡传递到父选项卡

来自分类Dev

Ionic 2将选项卡NavParams传递给选项卡

来自分类Dev

在ionic2中设置默认选项卡

来自分类Dev

Powershell命令比较2个Excel选项卡

来自分类Dev

将服务注入选项卡ionic 2

来自分类Dev

MySQL从2个选项卡中选择值

来自分类Dev

在tmux中重命名Iterm2选项卡

来自分类Dev

删除2 jquery选项卡之间的填充

来自分类Dev

Powershell命令比较2个Excel选项卡

来自分类Dev

带选项卡的模态中的2个(或更多)表单

来自分类Dev

将服务注入选项卡ionic 2

来自分类Dev

使用Angular2材质创建选项卡

来自分类Dev

Angular Material 2 无法设置默认活动选项卡

来自分类Dev

Angular 2+ 单独窗口/选项卡之间的交互

来自分类Dev

jQuery选项卡菜单

来自分类Dev

2个不同的菜单离子

来自分类Dev

选项卡控件类,具有2种通用类型的选项卡和页面,它们彼此链接

来自分类Dev

在2选项卡视图控制器中更改自定义选项卡栏位置

来自分类Dev

具有2个选项卡的选项卡栏控制器启动视图同时加载

来自分类Dev

隐藏选项卡侧面的竖线

来自分类Dev

在ExtJS 4的选项卡面板中,如何创建父选项卡包括2个子选项卡

Related 相关文章

热门标签

归档