mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-23 05:58:26 +08:00
chore(build): fix demo compile errors, tslint errors
fix demo compile errors, tslint errors
This commit is contained in:
40
demos/src/platform/AppModule.ts
Normal file
40
demos/src/platform/AppModule.ts
Normal file
@ -0,0 +1,40 @@
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import { IonicApp, IonicModule, Platform } from 'ionic-angular';
|
||||
|
||||
|
||||
@Component({
|
||||
templateUrl: 'main.html'
|
||||
})
|
||||
export class ApiDemoPage {
|
||||
isIos: boolean;
|
||||
isAndroid: boolean;
|
||||
isWindows: boolean;
|
||||
|
||||
constructor(platform: Platform) {
|
||||
this.isIos = platform.is('ios');
|
||||
this.isAndroid = platform.is('android');
|
||||
this.isWindows = platform.is('windows');
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
template: '<ion-nav [root]="root"></ion-nav>'
|
||||
})
|
||||
export class ApiDemoApp {
|
||||
root = ApiDemoPage;
|
||||
}
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
ApiDemoApp,
|
||||
ApiDemoPage
|
||||
],
|
||||
imports: [
|
||||
IonicModule.forRoot(ApiDemoApp)
|
||||
],
|
||||
bootstrap: [IonicApp],
|
||||
entryComponents: [
|
||||
ApiDemoPage
|
||||
]
|
||||
})
|
||||
export class AppModule {}
|
88
demos/src/platform/main.html
Normal file
88
demos/src/platform/main.html
Normal file
@ -0,0 +1,88 @@
|
||||
<ion-header>
|
||||
|
||||
<ion-navbar>
|
||||
<ion-title>Platform</ion-title>
|
||||
</ion-navbar>
|
||||
|
||||
</ion-header>
|
||||
|
||||
|
||||
<ion-content class="platform-demo">
|
||||
|
||||
<p margin class="note">Change devices to see the platform values change.</p>
|
||||
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col><b>Name</b></ion-col>
|
||||
<ion-col><b>Value</b></ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<pre>platform.is('ios')</pre>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<pre [ngClass]="isIos ? 'platform-true' : 'platform-false'">{{isIos}}</pre>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<pre>platform.is('android')</pre>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<pre [ngClass]="isAndroid ? 'platform-true' : 'platform-false'">{{isAndroid}}</pre>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<pre>platform.is('windows')</pre>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<pre [ngClass]="isWindows ? 'platform-true' : 'platform-false'">{{isWindows}}</pre>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
</ion-content>
|
||||
|
||||
<style>
|
||||
.platform-demo ion-row ion-col:nth-child(odd) {
|
||||
flex: 0 0 62%;
|
||||
max-width: 62%;
|
||||
}
|
||||
|
||||
.platform-demo ion-row ion-col:nth-child(even) {
|
||||
flex: 0 0 38%;
|
||||
max-width: 38%;
|
||||
}
|
||||
|
||||
.platform-demo pre {
|
||||
background: #f8f8f8;
|
||||
font-size: 13px;
|
||||
min-height: 40px;
|
||||
padding: 4px;
|
||||
margin-top: 0;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 2px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.platform-demo .platform-true {
|
||||
background: #dff2bf;
|
||||
border-color: #4f8a10;
|
||||
}
|
||||
|
||||
.platform-demo .platform-false {
|
||||
background: #ffbaba;
|
||||
border-color: #d8000c;
|
||||
}
|
||||
|
||||
.platform-demo .platform-normal {
|
||||
background: #bde5f8;
|
||||
border-color: #00529b;
|
||||
}
|
||||
|
||||
.platform-demo .note {
|
||||
color: #444;
|
||||
font-style: italic;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user