ionic3

I have developed the app using ionic 3 and now while generating android apk file it 's size getting way too big. before the API integration The File Size Was 4.8MB once I Started API Interation I just Modified 10 Pages Then The APK File Size became 71 MB Cordova Plugins I have Used cordova-plugin-console cordova-plugin-datepicker cordova-plugin-device cordova-plugin-network-information cordova-plugin-splashscreen cordova-plugin-statusbar cordova-plugin-whitelist cordova-plugin-x-socialsharing cordova-sqlite-storage es6-promise-plugin ionic-plugin-keyboard I unziped the APK file to know what's

While working on Ionic 3 app I have faced problem that when you subscribe to observable from service in ngOnInit and update a local variable into it, it does not update the view. For e.g HTML template <p>{{myVariable}}</p> constructor(myService: MyService) { } ngOnInit() { this.myService.myObservable.subscribe((data) => { this.myVariable = data; }); } But when you do same thing from constructor, it works. contructor(myService: MyService) { this.myService.myObservable.subscribe((data) => { this.myVariable = data; }); } Its an Ionic 3 app. It contains different Ion Tabs. The problem is that the

I just want to hide the scrollbar, in a page that needs scrolling. I am using Ionic 2 My not working solution: .scroll-content-bar{ overflow: hidden; } This solution hide the scroll-bar but makes the screen unscrollable. First and foremost, changing natural behavior of the browser and expected user experience is a risky move. However, if you still really really want to, I think your best bet is to fake it. In this case, setting width to 0 should be enough but I'm also changing background colors to be completely transparent. div{ background: gray; height: 200px; overflow-y: scroll; } p{ border

Step 1 : Ionic create New App. (ionic start myApp1 sidemenu) Step 2 : Create New Page home and aboutus. (ionic generate page aboutus) step 3 : Create button at aboutus page for url redirect to another website. aboutus.html : (<button ion-button (click)="redirect()"> GO » <button>) aboutus.ts : redirect() { window.open(" https://www.w3schools.com/php/ ", "_self"); } step 4 : When i click GO button the url redirect to w3schools.com and again browser back button click the redirect to home page only. i need redirect to aboutus page. help me any one. Use it In App Browser Ionic Native plugin

How do i restrict the phone number field to 10 characters using angular2. i tried using ng-maxlenth but it is working only in browser but not in the android devices. I found one code snippet using angular 1. But how do i rewrite the the same code using angular2? app.directive("limitTo", [function() { return { restrict: "A", link: function(scope, elem, attrs) { var limit = parseInt(attrs.limitTo); angular.element(elem).on("keypress", function(e) { if (this.value.length == limit) e.preventDefault(); }); } } }]); <input limit-to="4" type="number" class="form-control input-lg" ng-model="search

I am working on the Ionic Ecommerce App and using API made in Laravel. I have added the products in the cart but when I am increasing the quantity of products in the cart, the price of product is increasing but the total price is not updating and also when removing the product from the cart, it is not updating the price. This is my cart.html : <ion-header> <ion-navbar color="primary"> <button ion-button menuToggle> <ion-icon name="menu"></ion-icon> </button> <ion-title> Your Cart </ion-title> </ion-navbar> </ion-header> <ion-content> <ion-list *ngFor="let itm of cartItems" class="myitem11">

I have an Ionic 2 app. The premise of the app is to take a class. Once a class has been opened the user is marked as taking this class in the remote API. The flow of data is: User opens 'Classes' tab. App requests 'Classes' data from API. Each class holds a 'status' for that user. User selects a class. This opens a new view in the app using NavController.push(Page, { 'classes': classObjFromApi }); . There are a few pages added to the stack, each has the classes object passed to it. On the final page the API is informed that the current class has been taken and the user can navigate back to the

I follow this http://ionicframework.com/docs/native/in-app-browser/ document for use inappbrowser and try with below steps : 1- install ionic cordova plugin add cordova-plugin-inappbrowser npm install --save @ionic-native/in-app-browser 2 - Add this plugin to app.module.ts provider 3 - add to constructor : constructor(private iab: InAppBrowser) { } 4- and use it in launch method like this : import { InAppBrowser,InAppBrowserEvent} from '@ionic-native/in-app-browser'; launch(urlc){ let url = 'https://example.com/'; let browser = this.iab.create(url, '_blank', 'location=yes'); browser.on(

I am new in ionic and wants to learn it. my question is How to change nav bar color for all the pages in ionic 3. I have been using following code <ion-header> <ion-navbar color="primary"> <button ion-button menuToggle> <ion-icon name="menu"></ion-icon> </button> <ion-title>Hello Ionic</ion-title> </ion-navbar> </ion-header> Is there any way to change nav bar color for all the pages instead of manually doing <ion-navbar color="primary"> Add following line to variables.scss file to change the color globally. $toolbar-background: #3D9BDD; This can achieve different way i will show you 2 way