我正在离子4拍摄我的第一个镜头。我创建了一个新项目:
ionic start newApp blank --type=ionic-angular
我习惯了ionic-angular
。
在package.json中我有以下内容:
{
"name": "courier-app",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"start": "ionic-app-scripts serve",
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint"
},
"dependencies": {
"@angular/animations": "5.2.11",
"@angular/common": "5.2.11",
"@angular/compiler": "5.2.11",
"@angular/compiler-cli": "5.2.11",
"@angular/core": "5.2.11",
"@angular/forms": "5.2.11",
"@angular/http": "5.2.11",
"@angular/platform-browser": "5.2.11",
"@angular/platform-browser-dynamic": "5.2.11",
"@ionic-native/core": "~4.18.0",
"@ionic-native/splash-screen": "~4.18.0",
"@ionic-native/status-bar": "~4.18.0",
"@ionic/storage": "2.2.0",
"ionic-angular": "^3.9.3",
"ionicons": "3.0.0",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.29"
},
"devDependencies": {
"@ionic/app-scripts": "3.2.1",
"typescript": "~2.6.2"
},
"description": "An Ionic project"
}
您可以清楚地看到ionic-angular
拥有最新版本3.9:
"ionic-angular": "^3.9.3"
IonicModule
导入app.module.ts
,但是,我将LoginPage
设置为首先加载的根页:
@NgModule({
declarations: [
MyApp,
HomePage,
LoginPage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage,
LoginPage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}
在app.component.ts中:
rootPage:any = LoginPage;
当我在登录页面添加登录按钮时:
<ion-button (click)="login()">Login</ion-button>
我有一个错误说:
<ion-button> is not a known element
使用此post的答案,我将其更改为:
<button ion-button ...>Login</button>
但据我所知,离子4中的成分(无论是什么类型)的行为是使用<ion-button>
而不是<button ion-button>
是否有任何缺失的进口,或者这只是离子4型离子角的新行为?
要开始一个Ionic 4项目,你必须
append --type=angular
到你的start command
!
ionic start project1 blank --type=angular
否则,CLI将生成Ionic 3项目,因此这些样本将失败。