@sanjay100 thank you, i already used liked this, but this feature now is deprecated in new version, and i am looking for using observable
↧
Events not worked in ionic 6.1.0
↧
Trouble opening menu after navigation to second page
app.component.html
<ion-menu side="start" type="overlay" class="left-menu">
<ion-header class="head">
<div class="enappd-header">
<ion-avatar slot="start" class="profile" style="margin-right: auto;">
<!-- <img src="../assets/pp.jpg"> -->
<img [src]="imgSrc">
</ion-avatar>
</div>
</ion-header>
<ion-content class="app-back" scroll-y="true">
<ion-list class="list-padd ion-no-margin ion-no-padding">
<ion-list-header>
<ion-label></ion-label>
</ion-list-header>
<div *ngFor="let p of beginner">
<div *ngIf="p.children && !p.module">
<ion-item detail (click)="expandMenu(p.title)">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
<div class="zero-h" [ngClass]="{'animate-expand': (showChildren == p.title)}">
<ion-menu-toggle auto-hide="false" *ngFor="let option of p.children">
<ion-item class="ion-padding-start" detail [ngClass]="{'disabled':option.disabled}"
(click)="redirectPage(option.url, option.disabled)">
<ion-icon slot="start" [name]="option.icon"></ion-icon>
<ion-label>
{{ option.title }}
</ion-label>
</ion-item>
</ion-menu-toggle>
</div>
</div>
<div *ngIf="p.children && p.module=='sidemenu'">
<ion-item detail (click)="expandMenu(p.title)">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
<div *ngIf="showChildren == p.title">
<div class="option_menu-button" *ngFor="let option of p.children;let i = index">
<ion-menu-button autoHide="false" menu="end">
<ion-item (click)="showSidemenu(i)" class="ion-padding-start" [routerLink]="[option.url]" detail>
<ion-icon slot="start" [name]="option.icon"></ion-icon>
<ion-label>
{{ option.title }}
</ion-label>
</ion-item>
</ion-menu-button>
</div>
</div>
</div>
<div *ngIf="!p.children">
<ion-menu-toggle auto-hide="false">
<ion-item [routerLink]="[p.url]" detail>
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
</ion-menu-toggle>
</div>
</div>
<ion-item detail (click)="logout()" class="ion-margin-top">
<ion-icon slot="start" name="person"></ion-icon>
<ion-label>
Logout
</ion-label>
</ion-item>
</ion-list>
<ion-list class="list-padd ion-no-margin ion-no-padding">
<ion-list-header>
<ion-label></ion-label>
</ion-list-header>
<div *ngFor="let p of startup">
<div *ngIf="p.children && !p.module">
<ion-item detail (click)="expandMenu(p.title)">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
<div class="zero-h" [ngClass]="{'animate-expand': (showChildren == p.title)}">
<ion-menu-toggle auto-hide="false" *ngFor="let option of p.children">
<ion-item class="ion-padding-start" detail [ngClass]="{'disabled':option.disabled}"
(click)="redirectPage(option.url, option.disabled)">
<ion-icon slot="start" [name]="option.icon"></ion-icon>
<ion-label>
{{ option.title }}
</ion-label>
</ion-item>
</ion-menu-toggle>
</div>
</div>
<div *ngIf="p.children && p.module=='sidemenu'">
<ion-item detail (click)="expandMenu(p.title)">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
<div *ngIf="showChildren == p.title">
<div class="option_menu-button" *ngFor="let option of p.children;let i = index">
<ion-menu-button autoHide="false" menu="end">
<ion-item (click)="showSidemenu(i)" class="ion-padding-start" [routerLink]="[option.url]" detail>
<ion-icon slot="start" [name]="option.icon"></ion-icon>
<ion-label>
{{ option.title }}
</ion-label>
</ion-item>
</ion-menu-button>
</div>
</div>
</div>
<div *ngIf="!p.children">
<ion-menu-toggle auto-hide="false">
<ion-item [routerLink]="[p.url]" detail>
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
</ion-menu-toggle>
</div>
</div>
</ion-list>
<ion-list class="list-padd ion-no-margin ion-no-padding">
<ion-list-header>
<ion-label></ion-label>
</ion-list-header>
<div *ngFor="let p of pro">
<div *ngIf="p.children && !p.module">
<ion-item detail (click)="expandMenu(p.title)">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
<div *ngIf="showChildren == p.title">
<ion-menu-toggle class="ion-menu-toggle" auto-hide="false" *ngFor="let option of p.children">
<ion-item class="ion-padding-start" detail [ngClass]="{'disabled':option.disabled}"
(click)="redirectPage(option.url, option.disabled)">
<ion-icon slot="start" [name]="option.icon"></ion-icon>
<ion-label class="menu-label">
{{ option.title }} <ion-icon *ngIf="option.device" name="phone-portrait" color="primary">
</ion-icon>
<ion-icon *ngIf="option.apple" name="logo-apple" color="primary"></ion-icon>
</ion-label>
</ion-item>
</ion-menu-toggle>
</div>
</div>
<div *ngIf="!p.children">
<div auto-hide="false">
<ion-item detail [routerLink]="[p.url]">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{ p.title }}
</ion-label>
</ion-item>
</div>
</div>
</div>
</ion-list>
</ion-content>
</ion-menu>
Newpage.html
<ion-buttons slot="start">
<ion-menu-button autoHide='false'></ion-menu-button>
</ion-buttons>
<ion-title>Legal</ion-title>
<ion-row style="padding-right:10px; padding-left:10px;">
<ion-col>
<p class="ion-text-justify">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's
standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to
make a type specimen book. It has survived not only five centuries, but also the leap into electronic
typesetting, remaining essentially unchanged.
</p>
<p class="ion-text-justify">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type
specimen book.
</p>
<p class="ion-text-justify">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in
some form, by injected humour, or randomised words which don't look even slightly believable. If you are going
to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of
text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making
this the first true generator on the Internet.
</p>
</ion-col>
</ion-row>
↧
↧
Ionic V5 Navigate back with parameters
I want to create a route where the user is able to select something, when he has selected the thing it should be used on the previous page. in Ionic 3 it was possible to use callback for this purpose, but since we use angular navigation we can’t serialize the function if we try to do something like
constructor(
private navController: NavController,
) { }
async selectItem() {
this.navController.navigateForward(
"select-customer", {
state: {
// breaks because it can't be serialized
onDone: (selectedItem) => {
}
},
})
}
Ideally I would want the solution behave like an android app, where the activity can return a value when the activity is done. Is there a way to achieve this?
↧
Trouble opening menu after navigation to second page
> 1. <ion-header>
> 2. <ion-toolbar>
> 3. <ion-buttons slot="start">
> 4. <ion-menu-button></ion-menu-button>
> 5. </ion-buttons>
> 6. <ion-title class="one"><img src="../assets/img/header.png" style="width:180px" /></ion-title>
> 7. </ion-toolbar>
> 8. </ion-header>
> 9. <ion-content >
> here go your newpage.html code
> 10. </ion-content>
↧
Trouble opening menu after navigation to second page
Its does not solve my problem
↧
↧
Trouble opening menu after navigation to second page
is any error shows in console of browser when you click on sidemenu button?
↧
Storage- Ionic2 RC
ionic is smart. when u use browser to run youre app IONIC STORAGE use indexeddb,websql ans etc.., in the other side when you run youre app in genymotion or devices IONIC STORAGE use from device storage…
if u run app in browser and get then NOT AVAILABLE ERROR or you`re data store in WebSql instead of indexeddb .just need to add localstorage to driverOrder to fix this.
I had this problem and fix when add localstorage…
↧
Cannot disable splashscreen on browser
Have you found a solution? same problem here.
↧
Trouble opening menu after navigation to second page
No.
i’ll explain you in detail when running my app it will open home page if i click on helpcenter named page it will redirect me correctly but if i go to login page it will redirect me there but after login or if i go back wihtout loggedin to application after that menu is not opening for that i need to refresh the whole application than only it will open
↧
↧
Cannot disable splashscreen on browser
Not yet, and seems like the Ionic team avoids to reply to inconvenient questions.
I asked also about a problem with scroll not detected by the browser (browser tab not hidden on scroll) and they avoid to reply too.
↧
Trouble opening menu after navigation to second page
you can cross check with helpcenter page as wel but can you share me login.ts code so i can help you.
↧
Imagepicker for browser
Is there no way to add image picker for ionic 4 in pwa app for browsers. It shows Cordova not available…Please help
↧
Trouble opening menu after navigation to second page
import { Component, OnInit } from ‘@angular/core’;
import { MenuController, Platform, AlertController } from ‘@ionic/angular’;
import { SplashScreen } from ‘@ionic-native/splash-screen/ngx’;
import { UtilService } from ‘…/…/services/util/util.service’;
import { AuthenticationService } from ‘…/…/services/firestore/firebase-authentication.service’;
import { IfStmt } from ‘@angular/compiler’;
import { LoadingController } from ‘@ionic/angular’;
import { AuthService } from ‘src/app/services/auth/auth.service’;
import { HttpErrorResponse, HttpClient } from ‘@angular/common/http’;
import { Router } from ‘@angular/router’;
import { User } from ‘…/…/models/auth.model’;
import { GooglePlus } from ‘@ionic-native/google-plus/ngx’;
@Component({
selector: ‘app-login’,
templateUrl: ‘./login.page.html’,
styleUrls: [’./login.page.scss’],
})
export class LoginPage implements OnInit {
emailPattern = “^[a-z0-9._%±]+@[a-z0-9.-]+.[a-z]{2,4}$”;
isLoginError: boolean = false;
user: User;
googleuser: any = {};
constructor(private googlePlus: GooglePlus, private http: HttpClient, private authservice: AuthService,
private router: Router, private platform: Platform, public loadingController: LoadingController,
public alertController: AlertController, private splashScreen: SplashScreen, public util: UtilService,
private menuCtrl: MenuController, private authServ: AuthenticationService) {
}
ngOnInit() {
}
async presentAlert() {
const alert = await this.alertController.create({
header: 'Alert',
subHeader: 'Email or Password is incorrect!!',
message: 'Pls Enter Valid Email/Password',
buttons: ['OK']
});
await alert.present();
}
ionViewDidEnter() {
this.menuCtrl.enable(false, 'start');
this.menuCtrl.enable(false, 'end');
this.platform.ready().then(() => {
this.splashScreen.hide();
});
}
OnSubmit(UserName, Password) {
this.authservice.userAuthentication(UserName, Password).subscribe((data: any) => { console.log("User login successfully");
localStorage.setItem('userToken', data.access_token);
this.router.navigate(['home']);
/*console.log("Login Page Token: ",data.access_token);*/ /*console.log("Login Page Token1:",data.accessToken);*/
},
(err: HttpErrorResponse) => {
this.presentAlert(); /*this.isLoginError = true;*/
})
}
googlelogin() {
console.log("GPBC");
this.googlePlus.login({}).then(res => {
this.googleuser = res;
this.GoogleGetData();
this.router.navigate(['home']);
}).catch(err => console.error(err));
}
async GoogleGetData() {
let token = this.googleuser.accessToken;
this.http.get('https://www.googleapis.com/plus/v1/people/me?access_token=' + this.googleuser.accessToken).subscribe((data: any) => {
this.googleuser.name = data.displayName;
this.googleuser.image = data.image.url;
localStorage.setItem('userToken', data.accessToken);
this.router.navigate(['home']);
})
}
}
↧
↧
In app purchase 2 returns transaction data null on android
I am currently using cordova in-app-purchase-2 on my ionic app. The app was already uploaded on google console for in-app purchase testing. And the in app purchase was already showing purchase success. My problem now is that i would like to get the receipt and signature in order for me to do a purchase validation on my backend. However, the json returns something but incomplete, the transaction data is currently null. Are you able to advise? Thanks
this line of code fetch the information of a product ( where transaction data is included but currently null )
this.store.get('ionic_101')
i have tried to insert this line of code in some of the in-app purchase 2 functions but instead of returning something, it does not return a result, the only way the it can return a result is outside of in-app-purchase-2 functions. I also did insert this after the store.refresh but not luck.
senddatatodatabase(JSON.stringify(this.store.get('ionic_101')));
ex.
this.store.when(productId).approved( (product: IAPProduct) => {
senddatatodatabase(JSON.stringify(this.store.get(‘ionic_101’)));
product.finish();
this.loader.dismiss();
});
↧
My app not worked on android version 8 to above
Added TargetSDK 28 then remove and add platform and build app show error invalid data chunk must be string or buffer “an error occurs while running subprocess cordova”
please provide proper solutions
thanks
↧
Cannot disable splashscreen on browser
indeed, i thought so too.
in the meantime i found a solution, i’ll just copy paste my uncleaned stuff, i let you remove what you don’t want:
put this in config.xml:
<platform name="browser">
<preference name="AutoHideSplashScreen" value="true" />
<preference name="SplashScreenBackgroundColor" value="white" />
<preference name="ShowSplashScreen" value="false" />
<preference name="SplashScreenWidth" value="152" />
<preference name="SplashScreenHeight" value="152" />
</platform>
and then, copy paste config.xml in www/ after the build (if www is served by your backend as it is for me). then, if you want to turn on the splashscreen on browser, be sure www/ also contains the folder and image for it (i had to make a script that does: ionic cordova build browser --prod, cp config.xml www/config.xml, and cp the image as well in www/)
↧
Trouble opening menu after navigation to second page
after successfully login use navigateByUrl instead navigate
this.router.navigateByUrl(’/home’);
↧
↧
Printing on bluetooth printers
@vishwas097 did you get any solution?
↧
Trouble opening menu after navigation to second page
is this solve my menu problem?
↧
Trouble opening menu after navigation to second page
i have used in my application navigation working fine. try to use this may be solved your menu problem
↧