https://www.joshmorony.com/the-ionic-4-migration-survival-guide/
this.router.navigateByUrl('/login');
this.router.navigate(['/detail', { id: itemId }]);
this.router.navigateByUrl(`/detail/${todo.id}`);
this.router.navigate(['../', { id: crisisId, foo: 'foo' }], { relativeTo: this.route });
this.navCtrl.navigateForward('/route');
this.navCtrl.navigateBack('/route');
this.navCtrl.navigateRoot('/route');
const routes: Routes = [
{ path: 'login', component: LoginPage },
{ path: 'home', component: HomePage },
{ path: 'detail/:id', component: DetailPage },
{ path: '', redirectTo: '/login', pathMatch: 'full'}
];
const routes: Routes = [
{ path: 'login', loadChildren: './pages/login/login.module#LoginModule' },
{ path: 'home', loadChildren: './pages/home/home.module#HomeModule' },
{ path: 'detail/:id', loadChildren: './pages/detail/detail.module#DetailModule' },
{ path: '', redirectTo: '/login', pathMatch: 'full' },
];
<ion-item [routerLink]="'/detail/' + item.id" routerDirection="forward">
<ion-item [href]="'/detail/' + todo.id">
<ion-item [href]="'/detail/' + todo.id">
this.router.navigate(['/detail', { id: itemId }]);
this.router.navigateByUrl(`/detail/${todo.id}`);
export class DetailPage {
private todo;
constructor(private route: ActivatedRoute, private todoService: TodoService){ }
ionViewWillEnter(){
let todoId = this.route.snapshot.paramMap.get('id');
this.todo = this.todoService.getTodo(todoId);
}
}
@Component()
export class SomeParentComponent {
constructor(public modalController: ModalController) {}
async presentModal() {
const modal = await this.modalController.create({
component: ModalPage,
componentProps: {
foo: 'hello',
bar: 'world'
}
});
return await modal.present();
}
}
@Component()
export class ModalPage implements OnInit {
@Input() foo:any;
@Input() bar:any;
ngOnInit() {
console.log(`${foo} ${bar}`)
}
}
<button ion-button> to <ion-button>
<ion-navbar> to <ion-toolbar>
<ion-buttons end> to <ion-buttons slot="end">
replace (click) handlers with routerLink
ionViewDidLoad then you should swap them out for their Angular counterparts like ngOnInit or ngAfterViewInit
import { Component } from '@angular/core';
import { ModalController } from '@ionic/angular';
import { ModalPage } from '../modal/modal.page';
@Component()
export class SomeParentComponent {
constructor(public modalController: ModalController) {}
async presentModal() {
const modal = await this.modalController.create({
component: ModalPage,
componentProps: {
foo: 'hello',
bar: 'world'
}
});
return await modal.present();
}
}
import { Component, OnInit } from '@angular/core';
@Component()
export class ModalPage implements OnInit {
foo;
bar;
ngOnInit() {
console.log(`${foo} ${bar}`)
}
}
ionic cordova run android
ionic cordova run android --buildConfig=build.json
ionic cordova run android --prod --release -- -- --gradleArg=-PcdvBuildMultipleApks=true
ionic cordova run android --prod --release -- -- --keystore=filename.keystore --alias=myalias
ionic cordova run android --prod --release -- -- --minSdkVersion=21
ionic cordova run android --prod --release -- -- --versionCode=55
ionic cordova run android --prod --release --buildConfig=build.json
ionic cordova run android -l
ionic cordova run ios
ionic cordova run ios --buildConfig=build.json
ionic cordova run ios --livereload
ionic cordova run ios --livereload-url=http://localhost:8100
ionic cordova run ios --prod --release
ionic cordova run ios --prod --release -- --developmentTeam="ABCD" --codeSignIdentity="iPhone Developer" --packageType="app-store"
ionic cordova run ios --prod --release --buildConfig=build.json