@tinks wrote:

We are about to let someone go from our company, they have access to deploy live apps from their machine. What process should I follow to prevent them from being able to deploy directly to user phones? I will be changing passwords etc. for the ionic account, but this question is specifically for deploying directly from cli. Will changing the password also revoke CLI access? (Don't want to try it before to intimate them that something is going on).

Posts: 3

Participants: 2

Read full topic

@ultradryan wrote:

In a page I have a competent(child) to handle a PopOver menu that make changes to some variables on the page(parent).

in the Component I hv:
import { Component, Output, EventEmitter } from '@angular/core';

@Component({
    template: `
        <ion-list radio-group [(ngModel)]="someVar"  (ionChange)="changeSomthing()">
          <ion-item>
            <ion-label>A</ion-label>
            <ion-radio value="A"></ion-radio>
          </ion-item>
          <ion-item>
            <ion-label>B</ion-label>
            <ion-radio value="B"></ion-radio>
          </ion-item>
          <ion-item>
            <ion-label>C</ion-label>
            <ion-radio value="C"></ion-radio>
          </ion-item>
        </ion-list>
    `
})

export class Popover {
    constructor(private navParams: NavParams) {};
    someVar: any;
    @Output() update : EventEmitter<any> = new EventEmitter<any>();

    changeSomthing(){
        if (this.someVar) {
            this.globalVar.someVar= this.someVar;
            this.update.emit({ someVar: this.someVar } );
        }
    }
}

Then I tried to catch the changes in the page:

<p (update)="someUpdate($event)">
        {{someVar}}
    </p>

in the page.ts:

export class HomePage {

    constructor(public navCtrl: NavController) {}
    someVar: any;
    ngOnInit() {
        this.someVar= "A";
    }
    someUpdate(event) {
        this.someVar= event.someVar;
        console.log("catch");
    }
}

Though it seems someUpdate(event) was never fired up, what did I missed?
I followed a tutorial similar here:

Posts: 1

Participants: 1

Read full topic

@rsa wrote:

is there any way to add localization settings something like "&language=ja&region=JP" for google map api?

Posts: 1

Participants: 1

Read full topic

@rigorio wrote:

Hi. We're developing a navigation app. We're using Ionic 3 and for the map we're using LeafletJS. However, at the moment, the way we're using the map is we grabbed access tokens from mapbox and put the leafletJS map code in the index.html file of the ionic 3 project itself. it works. but i know it's wrong. I know it should be treated as a separate component, but i can't get it working when i declare it as a template or put it in a new page html file and import it into a typscript then export it. any ideas? our current problem is with the script links and script src. we don't know where to place them so we just put them in index.html and that's what's working right now.

Posts: 2

Participants: 2

Read full topic

@akshatbhargava123 wrote:

I was following this setup guide:
Ionic Cloud services integration setup

On running this command:

npm install @ionic/cloud-angular --save

I am getting this error message:

askGanesha@0.0.1 C:\Users\aksha\Desktop\ionic_apps\askGanesha
`-- (empty)

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any
"} (current: {"os":"win32","arch":"x64"})
npm WARN enoent ENOENT: no such file or directory, open 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\@ioni
c\cloud\package.json'
npm ERR! Windows_NT 10.0.15063
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "ins
tall" "@ionic/cloud-angular" "--save"
npm ERR! node v6.10.3
npm ERR! npm v3.10.10
npm ERR! path C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules.staging\rxjs-41b0b4f9
npm ERR! code EPERM
npm ERR! errno -4048
npm ERR! syscall rename

npm ERR! Error: EPERM: operation not permitted, rename 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules.stagi
ng\rxjs-41b0b4f9' -> 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\ionic-native\node_modules\rxjs'
npm ERR! at destStatted (C:\Program Files\nodejs\node_modules\npm\lib\install\action\finalize.js:25:7)
npm ERR! at C:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\polyfills.js:264:29
npm ERR! at FSReqWrap.oncomplete (fs.js:123:15)
npm ERR!
npm ERR! Error: EPERM: operation not permitted, rename 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules.stagi
ng\rxjs-41b0b4f9' -> 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\ionic-native\node_modules\rxjs'
npm ERR! at Error (native)
npm ERR! { Error: EPERM: operation not permitted, rename 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules.st
aging\rxjs-41b0b4f9' -> 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\ionic-native\node_modules\rxjs'
npm ERR! at destStatted (C:\Program Files\nodejs\node_modules\npm\lib\install\action\finalize.js:25:7)
npm ERR! at C:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\polyfills.js:264:29
npm ERR! at FSReqWrap.oncomplete (fs.js:123:15)
npm ERR!
npm ERR! Error: EPERM: operation not permitted, rename 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules.stagi
ng\rxjs-41b0b4f9' -> 'C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\ionic-native\node_modules\rxjs'
npm ERR! at Error (native) parent: 'ionic-native' }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.

npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\aksha\Desktop\ionic_apps\askGanesha\npm-debug.log
npm ERR! code 1

Note: askGanesha is the name of the app, my app directory is desktop/ionic_apps/askGanesha

Till now all npm packages were being installed without any error.

Ionic info output:

global packages:

    @ionic/cli-utils : 1.4.0
    Cordova CLI      : 7.0.1
    Ionic CLI        : 3.4.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.4.0
    @ionic/cli-plugin-ionic-angular : 1.3.1
    Cordova Platforms               : android 6.2.3
    Ionic Framework                 : ionic-angular 3.2.1

System:

    Node       : v6.10.3
    OS         : Windows 10
    Xcode      : not installed
    ios-deploy : not installed
    ios-sim    : not installed
    npm        : 3.10.10

Please help,
Thanks and Regards.

Posts: 3

Participants: 2

Read full topic

@Zuriel wrote:

let loader = this.loadingCtrl.create({
  content: 'Finding your info...'
});
loader.present();

Is there a way to programatically change the content of the loader, while its opened.

I wanted to communicate with a back end and use the loader as a platform to show the current progress of the account creation progress. Currently I am removing and recreating loaders for various steps but I would rather have 1 loader start, and not stop, but change the message inside during various processes. How can i connect to my current showing loader and update the content field?

thanks!

Posts: 1

Participants: 1

Read full topic

@akshatbhargava123 wrote:

I was following this guide for setup of cloud services: ionic Cloud Services
Till now I just have added this to ngModule imports array:

CloudModule.forRoot(cloudSettings)

Now as I do ionic serve, I am getting this error:

crypto.js:74
this._handle.update(data, encoding);
^

TypeError: Data must be a string or a buffer
at TypeError (native)
at Hash.update (crypto.js:74:16)
at HarmonyExportImportedSpecifierDependency.updateHash (C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\we
bpack\lib\dependencies\HarmonyExportImportedSpecifierDependency.js:144:8)
at C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\webpack\lib\DependenciesBlock.js:33:5
at Array.forEach (native)
at NormalModule.DependenciesBlock.updateHash (C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\webpack\lib\
DependenciesBlock.js:32:20)
at NormalModule.Module.updateHash (C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\webpack\lib\Module.js:1
62:41)
at NormalModule.updateHash (C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\webpack\lib\NormalModule.js:32
7:30)
at modules.forEach.m (C:\Users\aksha\Desktop\ionic_apps\askGanesha\node_modules\webpack\lib\Chunk.js:253:31)
at Array.forEach (native)

Please help, thanks.

Posts: 1

Participants: 1

Read full topic

@mcgowanb wrote:

I'm using the i18next library in my ionic2 application. I've ad some difficulty getting any of the actual plugins working with any sort of success but using the lib directly works, sort of.

When the application loads, I call the below function, which runs asynchronously

 i18next.use(i18nextXHRBackend).init({
      debug: true,
      lng: 'en',
      fallbackLng: 'en',
      returnEmptyString: true,
      // initImmediate : false,
      defaultNS: 'static',
      ns: ['static', 'dynamic'],
      // mapping: { "specific_backend_message": "message_for_translate" },
      backend: {
        loadPath: AppService.TRANSLATIONS_URI
      },
      interpolation: {
        prefix: "{{",
        suffix: "}}"
      }
    });

As its async the application continues to load and as a result the translations don't load as this process isn't completed. The view is then rendered before the translations are loaded and so don't show correctly. How do I prevent the root view getting rendered until this process completes? I've added the full app.component.ts below

import { Component, ViewChild } from '@angular/core';
import { Nav, Platform, ModalController, Loading, LoadingController, AlertController, Events } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { Storage } from '@ionic/storage';

import { PropertyListPage, RoomAvailabilityPage, DashboardPage, LoginPage } from '../pages/pages';

import { Settings } from '../models/Settings';
import { DataService, AppService } from '../providers/providers';

import * as i18next from 'i18next';
import * as i18nextXHRBackend from 'i18next-xhr-backend';

@Component({
  templateUrl: 'app.html',
})

export class MyApp {
  @ViewChild(Nav) nav: Nav;

  rootPage: any;
  authKey: string;
  private propertyKey: number;
  private _loading: Loading;
  pages: Array<{ title: string, component: any, icon: string }>;
  public viewReady: boolean = false;
  private _defaultLanguage: string = "en";

  constructor(
    public platform: Platform,
    public modalCtrl: ModalController,
    private dataService: DataService,
    private _loadingCtrl: LoadingController,
    private _alertCtrl: AlertController,
    private statusBar: StatusBar,
    private splashScreen: SplashScreen,
    private events: Events

  ) {
    this.rootPage = DashboardPage;
    this.authKey = localStorage.getItem(AppService.AUTH_KEY);
    if (!this.authKey) {
      this.rootPage = LoginPage;

    }
    else {
      this.propertyKey = parseInt(localStorage.getItem(AppService.PROPERTY_KEY));
      if (isNaN(this.propertyKey)) {
        this.rootPage = PropertyListPage;
      }
    }

    this.events.subscribe('loadingController', (data) => {
      this.manageLoadingDialog(data);
    });

    this.events.subscribe('displayConfirmationBox', (data) => {
      this.displayConfirmationBox(data.title, data.msg, data.pop);
    });

    this.events.subscribe('errorDisplay', (error) => {
      this.showError(error);

    });


    i18next.use(i18nextXHRBackend).init({
      debug: true,
      lng: this._defaultLanguage,
      fallbackLng: 'en',
      returnEmptyString: true,
      // initImmediate : false,
      defaultNS: 'static',
      ns: ['static', 'dynamic'],
      // mapping: { "specific_backend_message": "message_for_translate" },
      backend: {
        loadPath:  AppService.TRANSLATIONS_URI
      },
      interpolation: {
        prefix: "{{",
        suffix: "}}"
      }
    });



    // used for an example of ngFor and navigation - side bar menu
    this.pages = [
      { title: 'Dashboard', component: DashboardPage, icon: 'fa fa-home' },
      // { title: 'Arrivals', component: ArrivalsPage, icon: 'fa fa-sign-in' },
      // { title: 'Departures', component: DeparturesPage, icon: 'fa fa-sign-out' },
      // { title: 'Search Reservations', component: SearchBookingsPage, icon: 'fa fa-search' }
    ];

  }

  initializeApp() {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.


      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });
  }

  openPage(page) {
    // Reset the content nav to have just this page
    // we wouldn't want the back button to show in this scenario
    this.nav.setRoot(page.component);
  }

  manageLoadingDialog(data) {
    switch (data.action) {
      case 'show':
        this.showLoading(data.message);
        break;
      case 'hide':
        this.hideLoading();
        break;
    }
  }

  //loading dialog box
  showLoading(message?: string) {
    this._loading = this._loadingCtrl.create({
      content: message ? message : 'Please wait...'
    });
    this._loading.present();
  }


  hideLoading() {
    if (this._loading != null) {
      this._loading.dismiss();
      this._loading = null;
    }
  }


  logout() {

  }

  showError(error) {
    setTimeout(() => {
      this.hideLoading();
    });

    let alert = this._alertCtrl.create({
      title: 'Error',
      subTitle: error.message,
      buttons: ['OK']
    });
    alert.present(prompt);

    alert.onDidDismiss(() => {
      if (error.code == 401) {
        localStorage.clear();
        window.location.reload();
      }
    });
  }

  displayConfirmationBox(title: string, message: string, pop = false) {
    let alert = this._alertCtrl.create({
      title: title,
      subTitle: message,
      buttons: ['OK']
    });

    alert.onDidDismiss(() => {
      if (pop)
        this.nav.pop();
    });
    alert.present(prompt);
  }

}

Posts: 1

Participants: 1

Read full topic

@SharanuMK wrote:

I am implementing a social login with Linkedin login But I am not able to complete it
I am not getting If I use JavaScript means It will only work on laptop or browser not in mobile, If I user InappBrowser means the redirect_uri http://localhost/, http://localhost:8100/ and http://127.0.0.1/ are not returning to my app back
I need to get some basic profile info back to my app, If u know the steps or tutorial please let me know
please help me out

Posts: 1

Participants: 1

Read full topic

@vallee wrote:

Hi,
every time this throwErrorObservable is called i get undefined error (due to the events objects which is undefined)
I cannot understand why, what is the reason ? can i inject the Events object in my service provider ?
Thx fo any answer, i m stuck with this...

@Injectable()
export class ErrorHandlerService {

constructor( private events: Events ) {
console.log("constructor ErrorHandlerService events");
console.log(events); //this is well defined
}

public throwErrorObservable(error: any): any {
console.log(this.events) //this is "undefined" when the function is called WHY????
this.events.publish('http:status', error.status, Date.now());
return Observable.throw(new Error(error.status));

}

}

@NgModule({
...

providers: [
ErrorHandlerService,
Events,
...

]
})
export class AppModule { }

Posts: 1

Participants: 1

Read full topic

@NjalTheKnut wrote:

Hail, Ionites!

I am trying to make an app that will allow IT staff at my university to scan barcodes and then use that as a primary key in a MySQL database. I have designed and built the database, but the app is no more than a not-so-glorified barcode scanner that has no real functionality for the intended purpose.

I had watched a tutorial on youtube by Alex of CodeCast on how to do this using node.js and MySQL, linked here.

I tried to paste my edited version of the tutorial code into the typescript file of a new page designed for one of my database actions, but I got errors up the wazoo, presumably because there is a bigger difference between a *.js file and a *.ts file than I had originally thought.

My question is:

• Can I use the *.js files as they are, and not be required to convert them into *.ts files?

I am just learning how to develop for mobile platforms, and I hadn't done any javascript coding until about a week ago, so I appreciate any constructive criticism or friendly advice.

home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { BarcodeScanner } from '@ionic-native/barcode-scanner';


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

    constructor(public navCtrl: NavController,
        private barcodeScanner: BarcodeScanner) {

    }

    barcodeData: any;
    scanResult: any;

    goToFetch() {
        this.navCtrl.push('page-fetch');
    }

    goToUpdate() {
        this.navCtrl.push('page-update');
    }

    ScanBarcode() {
        this.barcodeScanner.scan().then((barcodeData) => {
            console.log("Scan Successful: " + barcodeData.text);
            this.scanResult = barcodeData.text;
            //alert("Scan Successful: " + this.scanResult);
        }, (err) => {
            console.error("Scan Failure: " + err);
            alert("Scan Failure: " + err);
            return;
            });
    }
}

insert.js

var mysql = require('mysql');

var connection = mysql.createConnection({

    host: 'localhost',

    user: 'root',

    password: '',

    database: 'assetdb'

});

connection.connect();



var asset = {
    asset_tag: scanResult,
    asset_type: ,
    deployment_cycle: ,
    year_issued: ,
    manufacturer: ,
    model: ,
    asset_location: ,
    asset_department:
}



var query = connection.query('insert into assets set ?', asset, function (err, result) {

    if (err) {

        console.error(err);

        return;

    }

    console.error(result);
    console.log(query.sql);
});

select.js

var mysql = require('mysql');

var connection = mysql.createConnection({

    host: 'localhost',

    user: 'root',

    password: '',

    database: 'assetdb'

});

connection.connect();

var asset = {
    asset_tag = scanResult,
}

var query = connection.query('select a.*, c.* from assets a join computers c on a.asset_tag = c.asset_tag where a.asset_tag = ?', asset_tag, function (err, result) {
    if (err) {
        console.error(err);
        return;
    }
    console.error(result);
    console.log(query.sql);
});

Thank you in advance! I hope to get this sorted out soon!

PS- If you have need of any further information that is relevant to answering my question, please don't hesitate to ask!

Posts: 2

Participants: 2

Read full topic

@shakings wrote:

Hi, Hope you are well.

I'm trying to add a service in my ionic 3 app. When i swipe my hand over the screen without touching the phone need to vibrate. can anyone help please please.

Posts: 1

Participants: 1

Read full topic

@valueice wrote:

I am really new in both Angular and Ionic.
I am following a tutorial I found online to build a small app for training and testing purpose. However, in the tutorial Angular 2 was used.
I am using Angular 4 and Ionic 3.
Please, does anyone know why am getting the errors below? I also follow another tutorial and I am getting same type of error. Someone please help me.

Runtime Error
Uncaught (in promise): TypeError: Cannot read property 'title' of undefined
TypeError: Cannot read property 'title' of undefined at Object.eval [as
updateRenderer] (ng:///AppModule/DetailsPage.ngfactory.js:152:28) at
Object.debugUpdateRenderer [as updateRenderer]
(http://localhost:8100/build/main.js:13122:21) at checkAndUpdateView
(http://localhost:8100/build/main.js:12427:14) at callViewAction
(http://localhost:8100/build/main.js:12785:21) at execComponentViewsAction
(http://localhost:8100/build/main.js:12717:13) at checkAndUpdateView
(http://localhost:8100/build/main.js:12428:5) at callWithDebugContext
(http://localhost:8100/build/main.js:13484:42) at Object.debugCheckAndUpdateView [as checkAndUpdateView]
(http://localhost:8100/build/main.js:13024:12) at ViewRef_.detectChanges
(http://localhost:8100/build/main.js:10496:63) at Tab.NavControllerBase._viewAttachToDOM
(http://localhost:8100/build/main.js:44327:40)

Stack

Error: Uncaught (in promise): TypeError: Cannot read property 'title' of undefined
TypeError: Cannot read property 'title' of undefined
at Object.eval [as updateRenderer] (ng:///AppModule/DetailsPage.ngfactory.js:152:28)
at Object.debugUpdateRenderer [as updateRenderer] (http://localhost:8100/build/main.js:13122:21)
at checkAndUpdateView (http://localhost:8100/build/main.js:12427:14)
at callViewAction (http://localhost:8100/build/main.js:12785:21)
at execComponentViewsAction (http://localhost:8100/build/main.js:12717:13)
at checkAndUpdateView (http://localhost:8100/build/main.js:12428:5)
at callWithDebugContext (http://localhost:8100/build/main.js:13484:42)
at Object.debugCheckAndUpdateView [as checkAndUpdateView] (http://localhost:8100/build/main.js:13024:12)
at ViewRef_.detectChanges (http://localhost:8100/build/main.js:10496:63)
at Tab.NavControllerBase._viewAttachToDOM (http://localhost:8100/build/main.js:44327:40)
at c (http://localhost:8100/build/polyfills.js:3:13535)
at Object.reject (http://localhost:8100/build/polyfills.js:3:12891)
at Tab.NavControllerBase._fireError (http://localhost:8100/build/main.js:44060:16)
at Tab.NavControllerBase._failed (http://localhost:8100/build/main.js:44048:14)
at http://localhost:8100/build/main.js:44103:59
at t.invoke (http://localhost:8100/build/polyfills.js:3:9283)
at Object.onInvoke (http://localhost:8100/build/main.js:4427:37)
at t.invoke (http://localhost:8100/build/polyfills.js:3:9223)
at r.run (http://localhost:8100/build/polyfills.js:3:4452)
at http://localhost:8100/build/polyfills.js:3:14076

Additional Info

Ionic Framework: 3.4.2
Ionic App Scripts: 1.3.7
Angular Core: 4.1.3
Angular Compiler CLI: 4.1.3
Node: 6.11.0
OS Platform: Windows 10

App.component.ts

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { VinceService } from "./services/vince.service";
import { TabsPage } from '../pages/tabs/tabs';

@Component({
templateUrl: 'app.html',
providers: [VinceService]
})
export class MyApp {
rootPage:any = TabsPage;

constructor(platform: Platform, statusBar: StatusBar, splashScreen:
SplashScreen) {
platform.ready().then(() => {
  // Okay, so the platform is ready and our plugins are available.
  // Here you can do any higher level native things you might need.
  statusBar.styleDefault();
  splashScreen.hide();
});
}
}

My details ts page details.ts (having errors)

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';

@Component({

templateUrl: 'details.html'
})
export class DetailsPage {
item:any

constructor(public navCtrl: NavController, public params: NavParams) {
this.item = params.get('item');

}

}

My details page html details.html (having errors)

<ion-header>
<ion-navbar color="secondary">
    <ion-title>{{item.title}}</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<h2>Main Details</h2>
</ion-content>

My app page Vince.ts where I call list of data from Api (working fine)

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { VinceService } from "../../app/services/vince.service";
import { DetailsPage } from "../details/details";

@Component({
selector: 'vince',
templateUrl: 'vince.html'
})
export class VincePage {
items: any;
constructor(public navCtrl: NavController, private vinceSerivce:VinceService) {

}

ngOnInit(){
this.getPosts('sports', 10);
}

getPosts(category, limit){
this.vinceSerivce.getPosts(category, limit).subscribe(response => {
  this.items = response.data.children;
});
}

viewItem(item){
this.navCtrl.push(DetailsPage, {
  item:item
});

}

}

Vince.html (working fine)

<ion-header>
<ion-navbar color="secondary">
    <ion-title>Vince-App</ion-title>
</ion-navbar>
</ion-header>

<ion-content padding>
<h2>Welcome to My app</h2>
<ion-list>
    <ion-item *ngFor="let item of items">

        <ion-thumbnail *ngIf="item.data.thumbnail" item-left>
            <img src={{item.data.thumbnail}}>
        </ion-thumbnail>

        <h2>{{item.data.title}}</h2>
        <p>
            <ion-icon name="thumbs-up">{{item.data.score}}</ion-icon> &nbsp; &nbsp;
            <ion-icon name="chatboxes">{{item.data.num_comments}}</ion-icon>
        </p>
        <button ion-button clear item-right (click)="viewItem (item.dat)">View</button>

    </ion-item>
</ion-list>

Posts: 1

Participants: 1

Read full topic

@JamToak wrote:

I was just wondering what the best practices are designing the ux, when you want aspect ratios of objects not to change and to retain the same border-radius (or text position, size etc.) to object ratio.

Is it a good way to design all scss declarations in relation to vh or vw or are there other better ways to tackle these issues ?

I know this is more of a scss question than an ionic question but I thought this is a great place to ask this question nonetheless

Posts: 1

Participants: 1

Read full topic

@sampath wrote:

I have tried to run Ionic 3 app on Mac machine.No build errors and working fine on simulator.But I need to test it on Emulator hence I need to test the Native status bar plugin.Can you tell me why it gives below error? How can I run this on Emulator?

I have used this cli command:

> ionic cordova run ios and this too ionic cordova emulate ios But the same issue.

global packages:

    @ionic/cli-utils : 1.4.0
    Cordova CLI      : 7.0.1
    Ionic CLI        : 3.4.0

local packages:

    @ionic/app-scripts              : 1.3.8
    @ionic/cli-plugin-cordova       : 1.4.0
    @ionic/cli-plugin-ionic-angular : 1.3.1
    Cordova Platforms               : android 6.1.2 ios 4.4.0
    Ionic Framework                 : ionic-angular 3.4.2

System:

    Node       : v6.10.2
    OS         : macOS Sierra
    Xcode      : Xcode 8.3.3 Build version 8E3004b
    ios-deploy : 1.9.1
    ios-sim    : 6.0.0
    npm        : 3.10.10

Error:

No target specified for emulator. Deploying to iPhone-SE, 10.3 simulator

When I run the > cordova run --list --emulator on Mac machine it shows huge list of emulators as like:

iPhone-6, 8.2
iPhone-6, 8.3
iPhone-6, 10.3
iPhone-6, 8.4
iPhone-6, 9.0
iPhone-6, 9.1
iPhone-6, 9.2
iPhone-6, 8.1
iPhone-6, 9.3
iPhone-6-Plus, 8.2
iPhone-6-Plus, 8.3
iPhone-6-Plus, 10.3

Update 2:

I have run this:

ionic cordova run ios --target="iPhone-6, 10.3"
It gives this error.Can you tell me why?

Error: Cannot read property 'name' of undefined

[ERROR] Cordova encountered an error. You may get more insight by running the Cordova command above directly.

[ERROR] An error occurred while running cordova run ios --target "iPhone-6, 10.3" (exit code 1).

Posts: 1

Participants: 1

Read full topic

@Qwerty10110 wrote:

im trying to get started with ionic 2 and its been one hell of a steep learning curve. right now im trying to understand how to make a button that once pressed will do a simple alert. but i cant find a good tutorial, and the documentation is not helping.

please can anyone give me a simple template to get started on and explain how it works.

any help would be appreciated thankyou in advance

Posts: 11

Participants: 3

Read full topic

@moshik wrote:

does anybody knows how to implement card reader/swiper?
I have been asked to work with IDTECH iMag Pro II, i saw couple of plug-ins around but non of them installed correctly.

can anyone put me in the right direction?

thanks,

M

Posts: 1

Participants: 1

Read full topic

@rashidi wrote:

node_modules's size is 230MB and app's size is 34MB(with crosswalk).
Does reduce app's size if reduce node_modules's size?
Does node_modules's size affect to app's size?

Posts: 2

Participants: 2

Read full topic

@vithika wrote:

I want to create a dialer -pad in ionic 2 . Please provide me some details on this..
How to design this type of dialer-pad

Screenshot_2017-07-02-14-30-59-418_com.softrelay.calllog.png720x1280 48.8 KB

,I tried it using grid and adding buttons,but I am getting it like this--

image.png1366x768 49.6 KB

This is my html file code:-

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content >
 <ion-grid>
 <ion-row>
   <ion-col>
     <ion-input type="text" ></ion-input>
   </ion-col>
 </ion-row>
    <ion-row>
        <ion-col>
          <button ion-button color="light" >1 </button>

        </ion-col>
        <ion-col>
           <button ion-button color="light">2 ABC</button>
        </ion-col>
        <ion-col>
           <button ion-button color="light" >3 DEF</button>
        </ion-col>
    </ion-row>

    <ion-row>
        <ion-col>
           <button ion-button color="light"> 4 GHI</button>
        </ion-col>
        <ion-col>
         <button ion-button color="light">5 JKL</button>
        </ion-col>
        <ion-col>
           <button ion-button color="light">6 MNO</button>
        </ion-col>
    </ion-row>

 <ion-row>
        <ion-col>
           <button ion-button color="light"> 7 PQRS</button>
        </ion-col>
        <ion-col>
         <button ion-button color="light">8 TUV</button>
        </ion-col>
        <ion-col>
           <button ion-button color="light">9 WXYZ</button>
        </ion-col>
    </ion-row>
  <ion-row>
        <ion-col>
           <button ion-button color="light">*</button>
        </ion-col>
        <ion-col>
         <button ion-button color="light">0</button>
        </ion-col>
        <ion-col>
           <button ion-button color="light">#</button>
        </ion-col>
    </ion-row>
 <ion-row>
   <ion-col>
     <button ion-button block color="blue">CALL</button>
   </ion-col>
 </ion-row>
</ion-grid>
</ion-content>

Posts: 4

Participants: 2

Read full topic

@aebe wrote:

I'm trying to share PDF files with my ionic app like with dropbox, but it seems like a common issue. I did search around, but no success. Could someone help guide me? What I want is when a user opens a PDF file and clicks on the share button, my ionic app appears and takes that file and uploads it to the server. Is it possible to do that with deep linking? If so, could you guide me? I know how to upload the file to my server using Transfer plugin, but don't know how to share/get the file.

Thanks.

Posts: 1

Participants: 1

Read full topic