Создание приложения Master/Detail в Plunker с помощью Ionic 2

Основываясь на хорошем стандарте Ionic 2 plunkers здесь http://plnkr.co/edit/ZsoPeE?p=preview и http://plnkr.co/edit/WBeRRJyYucLwvckjh5W7?p=preview

Можете ли вы помочь настроить My Master/Detail Plunker? Я думал, что у меня все части на месте, но что-то упущено, поскольку он создает белый экран.

Вот моя попытка перехвата Master/Detail 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 { }

Ответы

Ответ 1

Fixed 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",, но не пользуетесь относительными URL-адресами 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')