使用离子2在Plunker中创建主/细节应用

Question

从某些优质的标准离子2 plunker构建http://plnkr.co/edit/zsopee?p=preview和http://plnkr.co/edit/wberrjyyuclwvckjh5w7？p = preview

您可以帮助调整我的主人/细节plunker吗？我以为我已经准备好了所有部分，但由于产生白屏时缺少一些东西。

这是我在主/细节上的尝试http://plnkr.co/edit/7nhiyma3tudd55nokoxyf？p = preview

import { NgModule } from '@angular/core';
import { IonicApp, IonicModule } from 'ionic-angular';
import { AppComponent } from './app.component';
import { HomePage } from '../pages/home/home';
import { MasterPage } from '../pages/master/master';
import { DetailPage } from '../pages/detail/detail';
import { Sheetsu } from '../providers/sheetsu';
@NgModule({
  imports: [ IonicModule.forRoot(AppComponent) ],
  declarations: [ AppComponent, HomePage, MasterPage, DetailPage],
  entryComponents: [ HomePage, MasterPage, DetailPage ],
  bootstrap: [ IonicApp ],
  providers: [ Sheetsu ]
})
export class AppModule { }

Answer 1

修复了plunker：http：//plnkr.co/edit/5v36c9qhhydgbiqsifbul？p = preview

你有几个错误

1） import { Sheetsu } from '../providers/sheetsu';＆lt; - 您的文件称为 Sheetsu，带有资本s

2）您的相对路径是错误的，您通过将pages: 'pages',放入配置中而使自己变得复杂，例如：

import { MasterPage } from '../pages/master/master';

内部HomePage应该是

import { MasterPage } from '../master/master';

3）您正在使用"module": "commonjs",，但不利用相对HTML URL：

templateUrl: 'pages/master/master.html', -> `templateUrl: './master.html',`

在您的@Component

内使用moduleId: module.id

4）您的按钮单击return this.http.get('../assets/sheetsu.json')应为return this.http.get('./assets/sheetsu.json')