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

时间:2017-02-23 08:51:33

标签: javascript angular ionic2

在此基础上建立一些优秀的标准Ionic 2掠夺者http://plnkr.co/edit/ZsoPeE?p=previewhttp://plnkr.co/edit/WBeRRJyYucLwvckjh5W7?p=preview

你能帮我调整我的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 个答案:

答案 0 :(得分:0)

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

你有几个错误

1) <!DOCTYPE html> <html> <head> </head> <body> <script> function isTyping() { document.getElementById('typing_on').innerHTML = "User is typing...! "; } function notTyping (){ document.getElementById('typing_on').innerHTML = "No one is typing ! "; } </script> <label> <textarea onkeypress="setTimeout(isTyping(),4000); setInterval(notTyping,5000)" name="textarea" id="textarea" cols="45" rows="5"></textarea> </label> <div id="typing_on">No one is typing -blank speace.</div> </body> </html>&lt; - 您的文件名为import { Sheetsu } from '../providers/sheetsu';,资本为S

2)你的相对路径是错误的,你通过在你的配置中加入Sheetsu使你自己变得复杂,例如:

pages: 'pages',

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

应为

HomePage

3)您正在使用import { MasterPage } from '../master/master';但未使用相对的html网址:

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

中加moduleId: module.id

4)点击@Component的按钮应为return this.http.get('../assets/sheetsu.json')