@anna_liebt wrote:

Hello,

I have 3 components A, B and C. Each componet has a modal, that opens and I can change something, for example the text of a button. This is working.

Further I have a componet1 which I can set with an array and NgFor the sequence of A’s, B’s and C’s in componet1 and set propertys to A, B and C’s. This is working.

Next I have a componet2 which has as content a list of component2. I feed component3 with an array that creates with ngfor the list and a sub array that feeds component 2 ans set the propertys of A,B and C#s This is also working.

If I tap for example on A I can change something for example a string in a button contained in A. This is working as expected.

Now I need from compont2 propertys somebody changed in A, B or C. I use @Viewchildren to get the componet1s and further I get the A, B and C’s.

But A.B. C’s property contains the initial values. For example If I set button with initial value ‘hello’ and user change it to ‘goodbye’ the button shows these change. If I get componet1 with viewchildren and further A and read the property, then it has ‘hello’ as value. Otherwise If I tap on A I can check it has ‘googbye’ as value.

Any advice what is wrong? or for what I must look or…

Best regards, anna-liebt.

Posts: 1

Participants: 1

Read full topic

@Ben1nB1ack wrote:

let me explain the Topic.

i have a formControlled form with a sliding item inside

    <ion-list>
      <ion-item-sliding *ngFor="let item of medListMedications; let i = index">
        <ion-item>
          <ion-row>
            <ion-col col-11>
                {{item.LBL_NME}} <br>
                <p> ({{item.DRUG_TYPE}}) Quantity: {{item.QTY}}</p>
            </ion-col>
            <ion-col col-1 align-items-end>
              ...
            </ion-col>
          </ion-row>
        </ion-item>
        <ion-item-options">
          <button
            ion-button
            color="danger"
            (click)="onRemoveMedication(i)">
            <ion-icon name="trash"></ion-icon>
            Delete
          </button>
        </ion-item-options>
      </ion-item-sliding>
    </ion-list>

this worked fine until i added a second option

        <ion-item-options  side="left">
          <button ion-button (click)="editMedicationQty(item)">
            <ion-icon name="build"></ion-icon>
            Edit
          </button>
        </ion-item-options>
        <ion-item-options  side="right">
          <button
            ion-button
            color="danger"
            (click)="onRemoveMedication(i)">
            <ion-icon name="trash"></ion-icon>
            Delete
          </button>

if i click on the delete button all is good
if i cllick on the added edit button it fires the popup and the form submit

i added a boolean var to check in onSubmit

onSubmit() {
    if (!this.blockSubmit) {

it still fires both, but, the boolean stops submit code from running. so its a workaround

Am I missing something.

Yes i have AlertControler imported
this page that house all this is a standard page called with

this.navCtrl.push(

Posts: 3

Participants: 2

Read full topic

@jamesharvey wrote:

Hello,

I want to use multiple html templates in a single page like in this example:

How can I do this on Ionic v3? I tried to use the code from the example and it didn’t work.

Posts: 1

Participants: 1

Read full topic

@arsene123 wrote:

I have an answer in json and I would like to post articles by date, need your help please !!!

Posts: 1

Participants: 1

Read full topic

@rmdave wrote:

I see this response on Google Login and sure looks to me that the IONIC2 AUTH support is down (yes, I know I need to migrate away). The status page reports all good. Anyone else seeing issues? And, is there a real time feed elsewhere?

{"server":"openresty",
"content-type":"application/json; charset=utf-8",
"access-control-allow-credentials":"true",
"date":"Sat, 21 Oct 2017 00:30:01 GMT",
"connection":"keep-alive",
"access-control-allow-methods":"HEAD,GET,POST,PATCH,PUT,DELETE,OPTIONS",
"content-length":"203","via":"1.1 vegur",
"access-control-allow-origin":"file://",
"access-control-allow-headers":"DNT,Authorization,X-CSRFToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type"},
"header":{
"server":"openresty",
"content-type":"application/json; charset=utf-8",
"access-control-allow-credentials":"true",
"date":"Sat, 21 Oct 2017 00:30:01 GMT",
"connection":"keep-alive",
"access-control-allow-methods":"HEAD,GET,POST,PATCH,PUT,DELETE,OPTIONS",
"content-length":"203","via":"1.1 vegur",
"access-control-allow-origin":"file://",
"access-control-allow-headers":"DNT,Authorization,X-CSRFToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type"},
"type":"application/json",
"charset":"utf-8",
"body":{"error":{"link":null,"type":"InternalServerError","message":"500: Internal Server Error"},"meta":{"status":500,"request_id":"e76963d9-598b-4006-c0ef-0ac4daa22e5d","version":"2.0.0-beta.0"}}},"status":500,"__zone_symbol__currentTask":{"type":"eventTask","state":"scheduled","source":"XMLHttpRequest.addEventListener:readystatechange","zone":"angular","runCount":8}}

Posts: 3

Participants: 2

Read full topic

@altergothen wrote:

Do I still need to use "$ ionic addPlatform… "
if I am using Ionic Pro to build & deploy?
Or does Ionic Pro take care of that for me?

– Newb

Posts: 1

Participants: 1

Read full topic

@karvanj wrote:

Hi All,

I am successfully linked my app to Ionic Pro (paid version). I’ve gone to execute:

git push ionic master

However I get a build fail, here what it says:

Cloning into '/home/gitlab-runner/builds/c9648220/0/project-1'...
Checking out 7f9599f0 as master...
Skipping Git submodules setup
$ fetch-updates
Checking for build process updates...
$ build-app
Fetching build dependencies...
Running: npm install
npm WARN deprecated cordova-plugin-console@1.0.5: This plugin has been deprecated since it is now included in the latest versions of cordova-ios
npm WARN deprecated node-uuid@1.4.7: Use uuid module instead
npm WARN deprecated object-keys@0.2.0: Please update to the latest object-keys

> node-sass@4.5.3 install /usr/src/app/node_modules/@ionic/app-scripts/node_modules/node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.5.3/linux-x64-57_binding.node
Download complete
Binary saved to /usr/src/app/node_modules/@ionic/app-scripts/node_modules/node-sass/vendor/linux-x64-57/binding.node
Caching binary to /home/gitlab-runner/.npm/node-sass/4.5.3/linux-x64-57_binding.node

> uglifyjs-webpack-plugin@0.4.6 postinstall /usr/src/app/node_modules/@ionic/app-scripts/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js


> node-sass@4.5.3 postinstall /usr/src/app/node_modules/@ionic/app-scripts/node_modules/node-sass
> node scripts/build.js

Binary found at /usr/src/app/node_modules/@ionic/app-scripts/node_modules/node-sass/vendor/linux-x64-57/binding.node
Testing binary
Binary is fine
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.2 (node_modules/@ionic/app-scripts/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 818 packages in 29.331s
npm install succeeded
Running: npm run build
npm info it worked if it ends with ok
npm info using npm@5.3.0
npm info using node@v8.2.1
npm info lifecycle ourmgmt2-mobile@0.0.1~prebuild: ourmgmt2-mobile@0.0.1
npm info lifecycle ourmgmt2-mobile@0.0.1~build: ourmgmt2-mobile@0.0.1

> ourmgmt2-mobile@0.0.1 build /usr/src/app
> ionic-app-scripts build

module.js:487
    throw err;
    ^

Error: Cannot find module '@angular/tsc-wrapped/src/tsc'
    at Function.Module._resolveFilename (module.js:485:15)
    at Function.Module._load (module.js:437:25)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object. (/usr/src/app/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:6:13)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
npm info lifecycle ourmgmt2-mobile@0.0.1~build: Failed to exec build script
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! ourmgmt2-mobile@0.0.1 build: `ionic-app-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the ourmgmt2-mobile@0.0.1 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/gitlab-runner/.npm/_logs/2017-10-21T02_03_32_953Z-debug.log
npm run build failed
Make sure your project has a build script in the package.json
Running after script...
$ clean-up
Cleaning up files...
Successful clean up
ERROR: Job failed: exit status 1

Here is my Ionic Info:

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.13.1
    ionic (Ionic CLI) : 3.13.2

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.0.0
    Cordova Platforms  : android 6.1.2 ios 4.4.0
    Ionic Framework    : ionic-angular 3.7.1

System:

    ios-deploy : 1.9.1
    Node       : v8.6.0
    npm        : 5.3.0
    OS         : macOS Sierra
    Xcode      : Xcode 9.0 Build version 9A235

Misc:

    backend : pro

I’ve been spending hours on how to resolve this. Appreciate if any can help me on this?? Thanks in advance

Posts: 1

Participants: 1

Read full topic

@mateuspetter wrote:

I’ve recently released my app to both App and Play store, and some users complained about a really weird problem. Sometimes the app goes to Ionic default page (Ionic blank) and I don’t even have it in my project, could it be because of an outdated plugin?

Ionic info:

cli packages:

@ionic/cli-plugin-cordova       : 1.6.2
@ionic/cli-plugin-ionic-angular : 1.4.1
@ionic/cli-utils                : 1.7.0
ionic (Ionic CLI)               : 3.7.0

global packages:

Cordova CLI : 7.0.1

local packages:

@ionic/app-scripts : 3.0.1
Cordova Platforms  : android 6.2.3
Ionic Framework    : ionic-angular 3.7.1

System:

Node : v8.7.0
OS   : Windows 10
npm  : 5.4.2

Posts: 1

Participants: 1

Read full topic

@Adam1234 wrote:

I wish to change the front end design of my calendar from this:

Screen Shot 2017-10-21 at 5.09.25 pm.png666x516 37.5 KB

To this:

Practically I would like to remove the line dividers next to each day and change the selected day from a square to a circle.

Thanks

Posts: 1

Participants: 1

Read full topic

@moshik wrote:

Hi,

I have recently upgraded my project to the latest version(3.7.1), since the upgrade I cannot use “ionic cordova run ios -lc”, the app starts and hangs immediately.

I found out that when i uninstall Cordova codepush plugin everything works fine, installing it again kills livereload.

even with a blank project, as soon as you’ll install codePush plugin the livereload stop working for “ionic run”.
tried also to downgrade the plugin version with the same results.
anyone faced the same issue?
any workarounds for it?
10x

Posts: 1

Participants: 1

Read full topic

@sampaththeman1 wrote:

Hi
I want to know how to install compass into a blank project also wanna know how to implement following example in ionic

Thanks

Posts: 1

Participants: 1

Read full topic

@sachinr2702 wrote:

Every time I run this code on my phone, it first displays

Module cordova-plugin-geofence.TransitionType does not exist

and then when I close the message and try to run the app anyway, it displays

[object PositionError]

Here is the code: (I have commented some snippets because not sure if it is right)

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Geolocation } from '@ionic-native/geolocation';
import { Geofence } from '@ionic-native/geofence';
import { SMS } from '@ionic-native/sms';
import { ActivePage } from '../active/active';

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

export class HomePage {

	radius: number = 100;
	error: any;
	success: any;


  constructor(public navCtrl: NavController, public geofence:Geofence, public geolocation: Geolocation, private SMS: SMS) {

document.addEventListener('deviceready', function () {
    // window.geofence is now available
    this.geofence.initialize().then(function () {
        console.log("Successful initialization");
    }, function (error) {
        console.log("Error", error);
    });
}, false);
/*
  	this.platform.ready().then(() => {

      geofence.initialize().then(
        () => console.log('Geofence Plugin Ready'),
        (err) => console.log('error is happening here')
      );

    });

    */
  }



  setGeofence(value: number) {

    this.geolocation.getCurrentPosition({
      enableHighAccuracy: true
    }).then((resp) => {
      var longitude = resp.coords.longitude;
      var latitude = resp.coords.latitude;
      var radius = value;

      let fence = {
          id: "myGeofenceID1",
          latitude:       latitude,
          longitude:      longitude,
          radius:         radius,
          TransitionType: 2, //see 'Transition Types' below

        }


        this.geofence.addOrUpdate(fence).then(
          () => this.success = true,
          (err) => this.error = "Failed to add or update the fence."
        );

        /* this.geofence.onTransitionReceived().subscribe(resp => {
          this.SMS.send('+918277628369', 'The person has left');
        });
        */

        /* this.geofence.onTransitionReceived().subscribe( res =>{

          /*res.forEach(function(geo) {
            console.log(geo);
          });
this.SMS.send('+918277628369', 'The senior citizen under your charge has left the house! Please ensure they are safe.');
        },
        (err) => console.log(err),
        ()    => console.log("done !")
    );

        this.navCtrl.push(ActivePage);
*/
    var phnum = document.getElementsByName("phnumber")

    this.geofence.onTransitionReceived().subscribe( res =>{

          res.forEach(function(geo) {
            console.log(geo);
            this.SMS.send(phnum, 'The person has left');
          });

        },
        (err) => console.log(err),
        ()    => console.log("done !")
    );


    }).catch((error) => {
      this.error = error;
      console.log(error);
    });
  }
}

Thanks for your help!

Posts: 1

Participants: 1

Read full topic

@Faizyfaazz wrote:

In my ionic project i used private api to get flight details. it successfully work in android build. When i create IOS build it didn’t show anything from the api. how can i solve this issue?

get_arrivalflights() {

    var communicationParams = {
      showLoader: true,
      reqUrl: "",
      reqBody: {},
      callBackSuccess: (response) => {
        console.log(response);
        this.objectData = response.flightStatuses;

      },
      callBackFailure: (response) => { console.log("failure dude"); console.log(response); }
    };
    this.restservice.makeGetRequest(communicationParams);
  }

makeGetRequest(communicationParams: any) {

  this.baseUrl = "  the url i want to call ";


    var loader;
    if (communicationParams.showLoader == true) {
      loader = this.loadingController.create({
        content: ""
      });
      loader.present();
    }
    this.http.get(this.baseUrl + communicationParams.reqUrl)
      .map(response => response.json())
      .subscribe(communicationParams.callBackSuccess, function(respone) {
          if (communicationParams.showLoader == true) {
            loader.dismiss()
          }
          communicationParams.callBackFailure(respone);
        },
        () => {
          console.log('Authentication Complete');
          if (communicationParams.showLoader == true) {
            loader.dismiss()
          }
        });
  }

Posts: 1

Participants: 1

Read full topic

@akhilsanker94 wrote:

Hi,
I am trying to change the default direction of ion-scroll,scrollX. The initial horizontal scrolling is from left-right.
Is there any way to change this direction to right-left.

My HTML:

<ion-item no-lines>
   <ion-scroll scrollX="true">
      <ion-avatar *ngFor="let image of image" >
      <img [src]= image.imgsrc>
       </ion-avatar>
   </ion-scroll>
 </ion-item>

It displays images and when the app is opened every time it displays the earlier images of my json file and need to scroll to right to see the lastly added images in json file.
The idea is to show the lastly added image when the app is opened and need to scroll to left to see the other images.
Now it works in the reverse order.

Any suggestion is appreciable.

Thanks,

Posts: 1

Participants: 1

Read full topic

@patrikd wrote:

Hi All,
I want to add downgular.js to my project for handling my downloads.
But I’m stucked whats the correct/ionic way to add this.
It depends on angular js. So if I add it to my assets/js folder and add:

  <script src="assets/js/downgular/downgular.js"></script>

to my index.html I get the error angular not defined.
Is there a more Ionic way to add this?
thx,
patrik

Posts: 2

Participants: 2

Read full topic

@Nouf wrote:

So I have this weird problem when I run my application on my android device the background color turn to gray which was previously white but when I run it on my browser or iPhone emulator the background is white which is the correct color and I have no clue why this is happening

Screen Shot 2017-10-21 at 2.42.27 PM.png670x860 39.5 KB

Screen Shot 2017-10-21 at 2.41.06 PM.png666x860 23.3 KB

Posts: 2

Participants: 2

Read full topic

@Ilhem23 wrote:

Hello,

i have the code below, i want to pass the value from datetime to another page but date.value does not work.
Formulaire.html :


La Date de l’enquête
<ion-datetime displayFormat=“MMM DD YYYY” #date [(ngModel)]=“myDate”>

<ion-item>
  <ion-label floating>L'heure de l'enquête</ion-label>
  <ion-datetime displayFormat="h:mm A"  pickerFormat="h mm A"  #heure [(ngModel)]="myHour"></ion-datetime>
</ion-item>

</ion-list>

<button ion-button block color=“secondary” (click)=“goToOtherPage(nom , secteur , de , vers , date , heure , tranche )” >Commencer L’Enquête

Formulaire.ts

if ((nom.value != “”)&&(secteur.value != “”)&&(de.value != “”)&&(vers.value != “”)&&(tranche.value != “”))
{
this.mynumber= tranche.value;

  this.navCtrl.push( AccueilPage,{nom: nom.value,secteur: secteur.value, de:de.value,vers: vers.value,date:date.value,heure:heure.value, tranche: tranche.value});
}

accueil.ts

constructor(public navController: NavController , private file: File , public navParams: NavParams,private sqlite: SQLite) {

this.nom = navParams.get(‘nom’);
this.secteur = navParams.get(‘secteur’);
this.de = navParams.get(‘de’);
this.vers = navParams.get(‘vers’);
this.date = navParams.get(‘date’);
this.heure = navParams.get(‘heure’);
this.tranch = navParams.get(‘tranche’);
this.createDataBase();

}

but when i excute the code the value of date and hour do not display.
what should i do?

Posts: 1

Participants: 1

Read full topic

@inder wrote:

hi @all,
i am trying to setup push notifications in my ionic 3 app using fcm , but i am unable to find out any proper tutorial for it .Also i am not able to find out register /unregister method in “cordova-plugin-fcm”. as i will register device token , when any user logged in and unregister , when that user logged out.
If anyone can help me in this regard , please help me
Thanks and regards

Posts: 1

Participants: 1

Read full topic

@aardra wrote:

Hi All

I am new to creator.

I have started working on a small project for an app using Creator.

I would like to change the color of the text used in put text box. But using the following does not make any difference
color: white !important;

As it does not toggle switch and scroll bards components.

Can someone advice me on how i can get more information on all the components and what parameters can be changed?

Thank You

DJ

Posts: 1

Participants: 1

Read full topic

@adnanu wrote:

A reCAPTCHA box doesn’t make sense in an installable app.

Here is my Home.html

<ion-content text-center>
  <img src="./../../assets/img/logo.png" alt="Logo">

<div id="recaptcha-container"></div>

 <ion-input text-center type="text" [(ngModel)]="phoneNumber" placeholder="ENTER YOUR PHONE NUMBER (+1-000-000-00)"></ion-input>

  <button text-center ion-button id="sign-in-button" (click)="signIn(phoneNumber)">
    Sign In
  </button>

</ion-content>

Here is my Home.ts

import { Component } from '@angular/core';
import { NavController, AlertController } from 'ionic-angular';
import { NewUserPage } from '../new-user/new-user';

import firebase from 'firebase';

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

  public recaptchaVerifier:firebase.auth.RecaptchaVerifier;

  constructor(public navCtrl: NavController, public alertCtrl:AlertController) {

  }

  ionViewDidLoad() {
    this.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container');
  }

  signIn(phoneNumber: number){
    const appVerifier = this.recaptchaVerifier;
    const phoneNumberString = "+" + phoneNumber;
    firebase.auth().signInWithPhoneNumber(phoneNumberString, appVerifier)
      .then( confirmationResult => {
        // SMS sent. Prompt user to type the code from the message, then sign the
        // user in with confirmationResult.confirm(code).
        let prompt = this.alertCtrl.create({
        title: 'Enter the Confirmation code',
        inputs: [{ name: 'confirmationCode', placeholder: 'Confirmation Code' }],
        buttons: [
          { text: 'Cancel',
            handler: data => { console.log('Cancel clicked'); }
          },
          { text: 'Send',
            handler: data => {
              confirmationResult.confirm(data.confirmationCode)
              .then(function (result) {
                // User signed in successfully.
                console.log(result.user);
              }).catch(function (error) {
                // User couldn't sign in (bad verification code?)
              });
            }
          }
        ]
      });
      prompt.present();
    })
    .catch(function (error) {
      console.error("SMS not sent", error);
    });

  }
}

How Do I manipulate or remove reCaptcha?

Posts: 2

Participants: 2

Read full topic