Questions tagged [ionic2]

Ionic 2 is the next generation of Ionic, the open source SDK that enables developers to build performant, high-quality mobile apps using familiar web technologies (HTML, CSS, and JavaScript). Ionic 2 is usually paired with Angular (2). Ionic 2 can also be used as a CSS framework but you'll miss out on the powerful gestures, UI animations and more useful things.

What is Ionic 2?

Ionic 3 was released on 7 April 2017 to overtake Ionic 2.

Ionic 2 was the next generation of Ionic's initial release, the open source SDK that enabled developers to build performant, high-quality mobile apps using familiar web technologies (HTML, CSS, and JavaScript).

Ionic 2 was usually paired with Angular (2). Ionic 2 could also be used as a CSS framework but that would void the powerful gestures and UI animations made to mimic native mobile interaction.


How to install and setup a project

Installing Ionic 2 can be done using npm and the ionic cli.

To install Ionic 2 run $ npm install -g ionic cordova. This will immediately install the ionic cli so all your ionic commands are ready to be used.

To setup a project with different :

  • tabs: $ ionic start myApp tabs
  • sidemenu: $ ionic start myApp sidemenu
  • blank: $ ionic start myApp blank

Where tabs will create an application where 4 tabs (positioned at the bottom of the screen are generated), sidemenu will generate a project with a sidemenu (also showing good use of NavController utilities) and blank will generate a project with just a single page.


Maturity/Version

Ionic 2's current version is 3.12.0. The first release of the final version. (as of 8 March, 2017).

how to install the latest version

If you want to create a new project with 3.12.0: $ npm install -g ionic

If you want to update an existing project to 3.12.0:

Update your package.json to match the following dependencies, remove the existing node_modules directory, and then run npm install:

  "dependencies": {
    "@angular/common": "2.4.8",
    "@angular/compiler": "2.4.8",
    "@angular/compiler-cli": "2.4.8",
    "@angular/core": "2.4.8",
    "@angular/forms": "2.4.8",
    "@angular/http": "2.4.8",
    "@angular/platform-browser": "2.4.8",
    "@angular/platform-browser-dynamic": "2.4.8",
    "@angular/platform-server": "2.4.8",
    "@ionic/storage": "2.0.0",
    "ionic-angular": "2.2.0",
    "ionic-native": "2.4.1",
    "ionicons": "3.0.0",
    "rxjs": "5.0.1",
    "sw-toolbox": "3.4.0",
    "zone.js": "0.7.2"
  },
  "devDependencies": {
    "@ionic/app-scripts": "1.1.4",
    "typescript": "2.0.9"
  }

Read more at 1


Useful Ionic 2 links

And of course the active community of Stack Overflow.

12143 questions
3
votes
1 answer

on clicking the name i want display their details in an ionic project

i have an restapi (api url:'http://rayi.in/dms-danish/api/loadUsers/1) which contains an array of objects. from the api i have list the name of person on clicking particular person i have show their details in a modal. i have listed the name from…
3
votes
0 answers

Ionic is it Possible Process Push Notification Data in the Background or when App is Closed?

I am trying to build an Ionic 3 app that works similar to SMS app where it will get the messages from google FCM push notification and store it the local sqlite DB and notify the user . When you launch the app it will check and display all messages…
3
votes
1 answer

keypress event is not working in ionic 2 Android

The keypress event is not fired in ionic 2 Android applications. The same is working fine with iOS and browser(chrome) platform. My requirement is to restrict the keyboard typing with some characters. ie, Don't want to show that characters which I…
Sanu
  • 131
  • 1
  • 2
  • 8
3
votes
1 answer

Ionic: Item with title and detail text

Question: Seems too simple - how can I achieve an item with title text and detail text? Example: Note: I have tried two possible solutions. Both result in a blank white item without content.
jublikon
  • 3,427
  • 10
  • 44
  • 82
3
votes
1 answer

Ionic 3 : Uncaught (in promise): removeView was not found

I am calling an alert on my Page. addError(title,message){ const alert = this.alertCtrl.create({ 'title': title, 'subTitle': message, 'buttons': ['OK'] }); alert.present(); } Html Code with content including…
Mantu Nigam
  • 3,690
  • 7
  • 24
  • 41
3
votes
2 answers

How to use function in *ngIf, resulting to infinite loop Angular 2

I have been trying in Angular2/4 to make something like when page renders it checks for a file and if file exists it shows a checkbox icon while if it doesnot exist then a download icon is shown. But it runs into infinite loop, it is suggested to…
3
votes
2 answers

Ionic2, ion-range custom content of the range pin

I am using ion-range with pin and steps. I get the current value in the range pin, but I want to add/append some text next to it. So far in ionic API and docs I did not find a way to modify the content from the range pin, so I am thinking on maybe…
3
votes
1 answer

Ionic 2 Camera select Video on iOS not working

I'm developing a App with Ionic 2 and I'm have problems with @ionic-native/Camera. I've this code on Upload.ts let loader = this.loading.create({ content: 'Carregando video....' }); loader.present().then(() => { const options: CameraOptions = { …
Rodrigo Chaves
  • 1,094
  • 8
  • 23
3
votes
2 answers

*ngFor iterates of an observable. Filtering onInput should be possible. How?

A view lists entries using a *ngFor based on an Observable: view.html {{medicine.name}} …
Jem
  • 6,226
  • 14
  • 56
  • 74
3
votes
0 answers

Ionic 2 - stop speech recognition manually on android device

I'm using "ionic-native" to make speech to text app. There is stopListening() method which works only on IOS device, But Android device automatically stops listening when user stops speaking. Is there any other way to to manually stop listening on…
Shreenil Patel
  • 1,054
  • 1
  • 9
  • 20
3
votes
2 answers

ionic 3 -Keyboard pushes the whole screen up

I build ionic 3 app. I have inputs field and when I press on them to begin to type anything the screen changed.. before when I press on any input field the screen changed(it's test also in real device)
Manspof
  • 598
  • 26
  • 81
  • 173
3
votes
3 answers

Google Maps Native cordova plugin with Ionic 3 only showing a grey box

I'm trying to get a map showing and alls I get is a grey box with the google logo at the bottom of it. I've looked at the other posts on this website, and tried them all and none of them seem to fix it. I'm using ionic 3.12.0 with cordova plugin…
NoobProGmer
  • 33
  • 1
  • 4
3
votes
1 answer

What will happens when I import unused additions in Ionic 2?

My question very simple, I want to know what will happens if I imported unused components or variables or any thing else ? Because as I see in my cmd lines, there's some red lines or marker but there is no visible actions... So should I take care…
Ali H
  • 903
  • 14
  • 36
3
votes
4 answers

Ionic exception when running any ionic command, how to?

I'm getting this error when i run a ionic command ionic ...: { Error at FatalException.Exception (C:\Users\crist\AppData\Roaming\npm\node_modules\ionic\node_modules\@ionic\cli-utils\lib\errors.js:8:23) at FatalException…
Patrioticcow
  • 26,422
  • 75
  • 217
  • 337
3
votes
1 answer

Proper workflow to handle 401 error on Ionic 3 app

I need to handle 401 error correctly on my Ionic 3 app. The below mentioned error comes when the app has not been used for a few days and after that user tries to access the app. This app has a backend web API(django) and it uses jwt token to…
Sampath
  • 63,341
  • 64
  • 307
  • 441
1 2 3
99
100