ionic3

Am looking for something similar to scrollIntoView() within Ionic2 to use when I click on a button, for example. None of the methods detailed in ion-content help. Please take a look at this working plunker You can use the scrollTo(x,y,duration) method (docs) . The code is pretty simple, first we obtain the position of the target element (a <p></p> in this case) and then we use that in the scrollTo(...) method. First the view: <ion-header> <ion-navbar primary> <ion-title> <span>My App</span> </ion-title> </ion-navbar> </ion-header> <ion-content> <button ion-button text-only (click)=

How can I prevent default navigation when pressing hardware back button? I've tried registerBackButtonAction , but then it overwrites behavior of back button in every page which I don't want. This didn't help either. document.addEventListener("backbutton", (event) => { event.preventDefault(); }, false); As you can see in Ionic docs registerBackButtonAction returns a function: A function that, when called, will unregister its back button action. So you can use that function to restore the default behavior when leaving the page, like this: import { Component} from '@angular/core'; @Component({

I had created the input type and created the border the border for that box,but when i had clicked in that button it is displaying the default color but i should not display the default color Below is the displayed image: Below is my html code: <ion-item class="Credit"> <ion-input type="number" placeholder="Credit Card number" class="form-control"></ion-input> </ion-item> Below is my css code: .Credit{ top: 20px; border-radius: 10px; width: 350px; display: block; margin-left: auto; margin-right: auto; background: url(../assets/images/credit_card.png); background-position:right; background-size

I have a component class as EventSchedulePage .It extends HandleStorageService abstract class as shown below.You can see that there is a method named showInvalidTokenAlert() on this subclass.I have to call this method each and every component(This method gives a token based error message to the user).So can you tell me how to implement or redesign my classes to cater this situation? 'cause I don't like to put showInvalidTokenAlert() on each and every component.I would like to keep that method's implementation on a single place. Subclass export class EventSchedulePage extends

Can you tell me how to add scss file to the stackblitz . I tried that.But it is not working. Please see that and let me know. I have tried to add home.html This is the project: stackblitz Scss should work in stackblitz : @Component({ selector: 'page-home', templateUrl: 'home.html', styleUrls: [ './home.scss' ] <== add this }) export class HomePage { Styles like page-home { .buttoncls { won't work for you with default encapsulation( ViewEncapsulation.Emulated ) because page-home is not part of home component template and angular adds attribute like [_ngcontent-c0] to styles. So we can change

I'm trying to make a homescreen page, where you don't have the tabsmenu and where I want to have some buttons to go straight to some Tab. I'm using the function this.navCtrl.push(TabsPage) ; But this function just go to the the first tab, always, to I have some extra param to go straight to some of my tabs? I'm afraid it's not included in Ionic by default, but you can add it to your app very easily. Please take a look at this working plunker Like you can see there, we just push the page that contains the tabs, but we send a parameter with the index of the tab that we want to select: public

What I am trying to achieve is when I click on the download button it should do somthing else and when clicking on the item it should open a new window <ion-list> <ion-item *ngFor="let reading_material of reading_materials" (click)="gotoReadingMaterial(reading_material)"> {{reading_material.title}} <ion-icon item-right name="download" (click)="downloadMaterial(reading_material)"></ion-icon> </ion-item> </ion-list> But when I click on the download button, both the events gets hit. Is there a way i can suppress the item event when i click on the download button ?? You can solve this issue by