Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all 49348 articles
Browse latest View live

Do you keep debug logging in production applications?

$
0
0

@thezoon wrote:

Just wanted you guys’ opinion on debug logging.

Once in a while I find myself updating my project plugins or something, and something stops working.
Then I start adding console.debug throughout the stack trace to find that some plugin has stopped resolving its Promise.

I’m thinking to just leave those log statements, as they are suppressed by --prod builds anyway. Then they might be helpful for debugging in the future. What’s your thoughts?

Posts: 1

Participants: 1

Read full topic


Ion-input border missing while inside ion-row

$
0
0

@Rashmin31 wrote:

while using inside ion-grid,row,col, the validation line or the focus line when focused on input text area is missing. Can someone please let me know what is the reason?

Posts: 1

Participants: 1

Read full topic

Play the audio from where it was paused

$
0
0

@vd_virani wrote:

Hi All,

I am having one page which consists the audio tracks. User is playing one audio from that page and then in between he pauses the audio then he move to another page and when come back on the same audio track page, the audio is started from starting instead of playing it from where it was paused.

Any help would be appreciable.

Posts: 1

Participants: 1

Read full topic

ERROR Error: Uncaught (in promise): SecurityError: The page needs to be fullscreen in order to call screen.orientation.lock()

$
0
0

@prawezmusharraf wrote:

Hi There,

I have got below error when I tried to change orientation of one of my page in Ionic 3 app. I have used below code to change Portrate mode to landscape mode.

ionViewDidEnter() {
    // this.statusBar.hide();
    // // Set orientation to portrait.unlock();
    this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.LANDSCAPE);
  }

But it returns me below error:

core.js:1350 ERROR Error: Uncaught (in promise): SecurityError: The page needs to be fullscreen in order to call screen.orientation.lock().
    at c (http://192.168.0.101:8100/build/polyfills.js:3:19752)
    at http://192.168.0.101:8100/build/polyfills.js:3:19174
    at t.invoke (http://192.168.0.101:8100/build/polyfills.js:3:14976)
    at Object.onInvoke (http://192.168.0.101:8100/build/vendor.js:5294:33)
    at t.invoke (http://192.168.0.101:8100/build/polyfills.js:3:14916)
    at r.run (http://192.168.0.101:8100/build/polyfills.js:3:10143)
    at http://192.168.0.101:8100/build/polyfills.js:3:20242
    at t.invokeTask (http://192.168.0.101:8100/build/polyfills.js:3:15660)
    at Object.onInvokeTask (http://192.168.0.101:8100/build/vendor.js:5285:33)
    at t.invokeTask (http://192.168.0.101:8100/build/polyfills.js:3:15581)

Below are my ionic and package.json information:

ionic info

cli packages: (C:\Users\prawez.musharraf\AppData\Roaming\npm\node_modules)

    @ionic/cli-utils  : 1.19.1
    ionic (Ionic CLI) : 3.19.1

global packages:

    cordova (Cordova CLI) : 8.0.0

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : android 7.0.0 browser 5.0.3
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.1.1
    Node              : v6.11.0
    npm               : 5.6.0
    OS                : Windows 8.1

Environment Variables:

    ANDROID_HOME : C:\Users\prawez.musharraf\AppData\Local\Android\Sdk

Misc:

    backend : pro
"dependencies": {
    "@angular/common": "5.0.3",
    "@angular/compiler": "5.0.3",
    "@angular/compiler-cli": "5.0.3",
    "@angular/core": "5.0.3",
    "@angular/forms": "5.0.3",
    "@angular/http": "5.0.3",
    "@angular/platform-browser": "5.0.3",
    "@angular/platform-browser-dynamic": "5.0.3",
    "@ionic-native/camera": "^4.5.3",
    "@ionic-native/core": "4.4.0",
    "@ionic-native/file": "^4.5.3",
    "@ionic-native/file-path": "^4.5.3",
    "@ionic-native/file-transfer": "^4.5.3",
    "@ionic-native/local-notifications": "^4.5.3",
    "@ionic-native/network": "^4.5.3",
    "@ionic-native/screen-orientation": "^4.5.3",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic-native/transfer": "^3.14.0",
    "@ionic/pro": "1.0.17",
    "@ionic/storage": "2.1.3",
    "@vimeo/player": "^2.2.1",
    "chart.js": "^2.7.1",
    "cordova": "8.0.0",
    "cordova-android": "7.0.0",
    "cordova-browser": "5.0.3",
    "cordova-plugin-badge": "^0.8.7",
    "cordova-plugin-camera": "^4.0.2",
    "cordova-plugin-crosswalk-webview": "^2.4.0",
    "cordova-plugin-device": "^2.0.1",
    "cordova-plugin-file": "^6.0.1",
    "cordova-plugin-file-transfer": "^1.7.1",
    "cordova-plugin-filepath": "^1.2.0",
    "cordova-plugin-ionic-keyboard": "^2.0.5",
    "cordova-plugin-ionic-webview": "^1.1.16",
    "cordova-plugin-local-notification": "^0.9.0-beta.2",
    "cordova-plugin-network-information": "^2.0.1",
    "cordova-plugin-screen-orientation": "^3.0.1",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "es6-promise-plugin": "^4.2.2",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "lodash": "^4.17.5",
    "lodash.indexof": "^4.0.5",
    "ng2-charts": "^1.6.0",
    "rxjs": "5.5.2",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.1.8",
    "@ionic/cli-plugin-proxy": "1.5.7",
    "typescript": "2.4.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-crosswalk-webview": {
        "XWALK_VERSION": "23+",
        "XWALK_LITEVERSION": "xwalk_core_library_canary:17+",
        "XWALK_COMMANDLINE": "--disable-pull-to-refresh-effect",
        "XWALK_MODE": "embedded",
        "XWALK_MULTIPLEAPK": "true"
      },
      "cordova-plugin-camera": {},
      "cordova-plugin-file": {},
      "cordova-plugin-file-transfer": {},
      "cordova-plugin-filepath": {},
      "cordova-plugin-local-notification": {},
      "cordova-plugin-network-information": {},
      "cordova-plugin-screen-orientation": {}
    },
    "platforms": [
      "browser",
      "android"
    ]
  }

I have check ionic forum for similar issue and tried every solution without any luck.
Could anyone suggest me how I can resolve this issue?

Thanks.

Posts: 1

Participants: 1

Read full topic

Can't install android platform

$
0
0

@Fredmoras wrote:

hello
I can’t instalI android platform on my project, since instalI android studio
I’ ve try to upgrade-downgrade java sdk, android sdk, nothings works.

I am now with:
android sdk 25
java sdk 1.8

My ionic info:

cli packages: (C:\Users\fred\AppData\Roaming\npm\node_modules)

    @ionic/cli-utils  : 1.19.1
    ionic (Ionic CLI) : 3.19.1

global packages:

    cordova (Cordova CLI) : 6.5.0

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : android broken
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.1.1
    Node              : v8.9.4
    npm               : 4.6.1
    OS                : Windows 10

Environment Variables:

    ANDROID_HOME : C:\Users\fred\AppData\Local\Android\Sdk

Misc:

    backend : pro

when I try to install android platform i have always the same issue.

Adding android project...
Creating Cordova project for the Android platform:
        Path: platforms\android
        Package: io.ionic.ternatsterker
        Name: ternatsterker
        Activity: MainActivity
        Android target: android-26
Subproject Path: CordovaLib
Android project created with cordova-android@6.4.0
Installing "cordova-plugin-camera" for android
Failed to install 'cordova-plugin-camera':Error: cmd: Command failed with exit code ENOENT
    at ChildProcess.whenDone (C:\Users\fred\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-common\src\superspawn.js:169:23)
    at emitOne (events.js:116:13)
    at ChildProcess.emit (events.js:211:7)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:196:12)
    at onErrorNT (internal/child_process.js:372:16)
    at _combinedTickCallback (internal/process/next_tick.js:138:11)
    at process._tickCallback (internal/process/next_tick.js:180:9)
Error: cmd: Command failed with exit code ENOENT

my project work properly on local or via ionic view, but can’t add a platform.
help me please.

Posts: 2

Participants: 2

Read full topic

Problem changing tabs component!

$
0
0

@amin-setayeshfar wrote:

so, i needed something like android studio Guided flow but i couldn’t find anything close.


so i did it myself with js and css and changing tab-botton.js in tabs module folder.
changes are applied and working fine in browser and android debug mode. but when i use --prod to release the app the template changes are gone and the original markup shows!
my only change was changing the tamplate in that file from this:
template: '<ion-icon *ngIf="tab.tabIcon" [name]="tab.tabIcon" [isActive]="tab.isSelected" class="tab-button-icon"></ion-icon>' +
                            '<span *ngIf="tab.tabTitle" class="tab-button-text">{{tab.tabTitle}}</span>' +
                            '<ion-badge *ngIf="tab.tabBadge" class="tab-badge" [color]="tab.tabBadgeStyle">{{tab.tabBadge}}</ion-badge>' +
                            '<div class="button-effect"></div>'

to this:

template: '<ion-icon *ngIf="tab.tabIcon" [name]="tab.tabIcon" [isActive]="tab.isSelected" class="tab-button-icon"></ion-icon>' +
                        '<div class="big-circle"></div><div #tabBtnBox class="tab-btn-box"><span *ngIf="tab.tabTitle" class="tab-button-text">{{tab.tabTitle}}</span></div>' +
                        '<ion-badge *ngIf="tab.tabBadge" class="tab-badge" [color]="tab.tabBadgeStyle">{{tab.tabBadge}}</ion-badge>' +
                        '<div class="button-effect"></div>'

Posts: 1

Participants: 1

Read full topic

Code to print bill in thermal printer

$
0
0

@emiljenson wrote:

Does anyone know how to print a table like structure and logo , like a bill or receipt in thermal printers.??? If so please share the code , so that i could follow it. I am stuck in this section

Posts: 2

Participants: 1

Read full topic

Countdown timer for buses


Ionic for commercial projects

$
0
0

@zolotoy wrote:

I am reading on the Web that Ionic is an opensource framework. But I check license it’s not so much free. can someone please explain?

Thanks

Posts: 1

Participants: 1

Read full topic

Ionic for windows 10 mobile

$
0
0

@zolotoy wrote:

Seems like the framework has an option for windows mobile development. My question is what version of Angular is supported?

Posts: 1

Participants: 1

Read full topic

Can anybody give me an example for modalCtrl.create(ModalClass) with common Component, rather than @IonicPage?

$
0
0

@janckerchen wrote:

I have a specific modal component, and I dont want to use @ionicpage in isolate module.

is there a demo for it with ionic3?

Posts: 1

Participants: 1

Read full topic

What exactly is the Ionic v3 CLI --cordova option

$
0
0

@rolinger wrote:

Can some one please clarify what the ionic start myApp tabs --cordova option actually means? The --help simply saays --cordova: Include cordova integration. What does this do?

Other than this description I can’t find any other information on it. Technically, Ionic is built on top of cordova right? So what does the --cordova integration mean if ionic is already laying on top of cordova.

I am upgrading my v1 project to the latest and greatest and have all kinds of things to catch up on…but this one is really throwing me. All of my plugins from v1 are cordova-plugin-<pluginName> - and I know some of the plugins I use are now integrated into cordova8.0 and ionic v3 has its own versions - so I will be using less 3rd party plugins…but still…the --cordova option is not making sense to me.

Thanks.

Posts: 4

Participants: 2

Read full topic

Stream mp3 audio player

$
0
0

@Bboypluss wrote:

Hi all,
i need to stream an mp3 from a server,but i’d like that the music starts immediatly.What are the best plugins to do this?

Posts: 1

Participants: 1

Read full topic

AR Measurement possible in Ionic 3?

$
0
0

@Roopesh wrote:

Is Augmented reality is possible in ionic?

We are trying to do the measurement in real time by using a mobile camera.
Example measuring objects such as furniture, rooms, kitchen etc…

Is there any possibility or AR plugin available in ionic?

Thank You in Advance

Posts: 1

Participants: 1

Read full topic

UI elements not responding dynamically in Ionic

$
0
0

@vahidv wrote:

Hi,

I have the following code:

<ion-card [hidden]=“checkOrderCondition”>
<button ion-button full color=“green” class=“toqeyButton” (click)=“processOrder()”>Scan Toqeys

Also tried the above with ‘*ngIf’. Here the UI should dynamically respond to the value of ‘checkOrderCondition’ (true/false).

I get this working in the app when I run it in the browser (ionic serve), where I see that the UI responds dynamically to when the boolean is set through events.

However, it seems not be responding directly within iOS (on the iPhone). I first have to press another UI element to see the UI respond to the above change.

Does anyone know how this is and how it can happen like that?

Posts: 2

Participants: 2

Read full topic


Unexpected error when loading livereload "X-Content-Type: nosniff"

$
0
0

@fzamperin wrote:

Hi guys I was debugging an app and then I started to do other things but when I runned the app again in livereload I encountered this issue, after a long search didn’t find nothing, does anyone have a clue about this problem? Thanks in advance.

//Command used:
ionic cordova emulate ios -lcs --target="iPhone-6s, 11.2"

cli packages: (/Users/Fzamperin/.nvm/versions/node/v8.9.4/lib/node_modules)

@ionic/cli-utils  : 1.19.1
ionic (Ionic CLI) : 3.19.1

global packages:

cordova (Cordova CLI) : 7.1.0 
Gulp CLI              : CLI version 3.9.1

local packages:

@ionic/app-scripts : 3.1.8
Cordova Platforms  : android 6.3.0 ios 4.5.4
Ionic Framework    : ionic-angular 3.9.2

System:

Android SDK Tools : 26.1.1
ios-deploy        : 1.9.2 
ios-sim           : 6.1.2 
Node              : v8.9.4
npm               : 5.6.0 
OS                : macOS Sierra
Xcode             : Xcode 9.2 Build version 9C40b 

Environment Variables:

ANDROID_HOME : /Users/Fzamperin/Library/Android/sdk

Misc:

backend : legacy

Posts: 1

Participants: 1

Read full topic

Create pages

$
0
0

@thiokoto wrote:

(urgent) Hello
I develop a beauty tip app.
and as you know there are several recipes and each recipe is a page.
my question is:
can I create for each recipe its own page or create a single detail-recipe page and from there generate the content of each recipe automatically by a .ts file.
thank you.

Posts: 1

Participants: 1

Read full topic

Best way to jump in to Ionic2 from pure Cordova background

$
0
0

@HankLloydRight wrote:

Hello everyone,

I’ve decided to move to the Ionic platform now that the Telerik AppBuilder for Cordova is going away in May. Yes, I know, that’s not the best hybrid platform, but I’ve already used it for the past year to develop a commercial game app using just Cordova, and I’m happy with how my app works currently.

But I need to find a new platform to continue development and eventual launch of my apps and I like what Ionic can offer. I’m proficient in all things Cordova – HTML, CSS, Javascript and especially jQuery (love, love, love jQuery). But I don’t know the first thing about Ionic 2, Typescript, or Angular. Or for that matter, building apps with the command line. I’ve used Telerik AppBuilder for production builds most recently, but in the past, used Phonegap Build for that (I have two commercial apps in the app stores now.)

I’ve been watching lots of the Ionic tutorial videos with Matt, but frankly coming from my background, it’s a bit overwhelming to understand how all these new pieces fit together in my mind which only knows “the old way” with pure HTML/JS/CSS. From the videos, it’s hard to tell what parts of the code are Ionic, Typescript, or Angular, and what purpose each one serves.

So as an experienced developer (I’m 53 years old and have been coding my entire adult life in many dozens of languages), what’s the best way to jump in to understand how Ionic, Typescript, Angular work, mapping those things to my existing experience so I can hit the ground running?

thanks.

Posts: 1

Participants: 1

Read full topic

How to upload two images to server using formdata?

$
0
0

@playfantasy wrote:

Hi friends,I want to upload two images after taking photos from camera.I want append them to form data but they are not uploading.Please help me. My code is

export class MyClass{
/PAN and Address are the two images I want to upload.I am saving the data in the following variables/
panCardImageData: any;
addressCardImageData: any
constructor(…){}

..................................


/I added a button in html view.On pressing it it calls takePANPhoto() method/
takePANPhoto() {
this.camera.getPicture({
quality: 100,
destinationType: this.camera.DestinationType.FILE_URI,
sourceType: this.camera.PictureSourceType.CAMERA,
encodingType: this.camera.EncodingType.PNG,
saveToPhotoAlbum: true
}).then(imageData => {
this.uploadPANPhoto(imageData);
}, error => {

});

}

private uploadPANPhoto(imageFileUri: any): void {
this.file.resolveLocalFilesystemUrl(imageFileUri)
.then(entry => (entry).file(file => this.readPANFile(file)))
.catch(err => console.log(err));
}

private readPANFile(file: any) {
const reader = new FileReader();
reader.onloadend = () => {
const formData = new FormData();
const imgBlob = new Blob([reader.result], { type: file.type });
formData.append(‘file’, imgBlob, file.name);
this.panCardImageData=formData;
//I saved the formData in panCardImageData
};
reader.readAsArrayBuffer(file);
}


/*On upload documents the method onKycSubmit() is called */

onKycSubmit() {

let formData: FormData = new FormData();
formData.append("pan", this.panCardImageData);
formData.append("kyc", this.addressCardImageData);
this.verifyService.kycFilesUpload("PANCARD", this.panCardImageData).subscribe((res) => {
  this.navCtrl.push(VerifyPage);
}, (error) => {
  console.log(error);
});

}

/*This is my API url in VerifyService */
kycFilesUpload(fileName:any,formData:any){
return this.http.post(this.funService.apiUrl +fileName,formData);
}

Please explain how to append image data collected from take picture to formdata

Posts: 1

Participants: 1

Read full topic

First Ionic application

Viewing all 49348 articles
Browse latest View live


Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>