使用 Ionic 2 在 Plunker 中创建 Master/Detail 应用程序

【问题标题】：Creating a Master/Detail app in Plunker with Ionic 2使用 Ionic 2 在 Plunker 中创建 Master/Detail 应用程序
【发布时间】：2017-07-13 15:36:37
【问题描述】：

在http://plnkr.co/edit/ZsoPeE?p=preview 和 http://plnkr.co/edit/WBeRRJyYucLwvckjh5W7?p=preview

你能帮忙调整我的 Master/Detail Plunker 吗？我以为我已经准备好了所有部件，但是因为它会产生白屏而缺少一些东西。

这是我对大师/细节的尝试 http://plnkr.co/edit/7NHIYMA3TUdd5nOkoXyF?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 { }

【问题讨论】：

标签： javascript angular ionic2

【解决方案1】：

固定 Plunker：http://plnkr.co/edit/5V36C9QHYDGBIqSIfBUl?p=preview

你有几个错误

1) import { Sheetsu } from '../providers/sheetsu'; Sheetsu，大写的S

2) 你的相对路径是错误的，你把pages: 'pages', 放在你的配置中，让你自己变得复杂，例如：

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

在HomePage里面应该是

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

3) 您正在使用"module": "commonjs",，但没有利用相对 html 网址：

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

moduleId: module.id 在您的 @Component 中

4) 你的按钮点击return this.http.get('../assets/sheetsu.json') 应该是return this.http.get('./assets/sheetsu.json')

【讨论】：