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

Manipulate Firestore Data in TypeScript

$
0
0

@trevorp123 wrote:

Total noob question, and I’m hoping it’s a simple answer. I’m using the angularfire2 library to connect to a Firestore database. I’m able to subscribe to a field and display it using a ngModel. I’m looking for a way to get the data and manipulate it in TypeScript. So far everything I’ve tried has just gotten me the document pointer but not the data itself. Can anyone point me in the right direction? Any help is greatly appreciated.

Posts: 2

Participants: 2

Read full topic


How to using grid image navigation?

$
0
0

@supakwong wrote:

Can you help me, I try to create menu with grid image clickable to other page.

I try find the idea on the Internet and not found it.

    <ion-col no-padding>
      <ion-img src="/assets/bellwhite.png" full no-margin href="/notification"></ion-img>
    </ion-col>

I try cover by button tag it’s not fit on grid.

Posts: 1

Participants: 1

Read full topic

Ionic 3 - File Opener not working on iOS via DevApp

$
0
0

@Morgs009 wrote:

Can anyone help figure out why my app is persisting that FileOpener plugin is not installed when it actually is?

Everytime I try to open a PDF/Image/Docx/XLSX or any other file type I get a notification in the console as per below:

enter image description here

I followed this tutorial here line by line and when I investigate the file structure I can see that the FileOpener plugin is there, see:

enter image description here

enter image description here

In my app.module.ts:

enter image description here

In my user.provider.ts file:

enter image description here

enter image description here

This is my DownloadDocument function:

async DownloadDocument( location: string, name: string, mime: string, message: string = undefined )
  {
    var loading = await this.ShowLoading( message );

    try
    {
      var dir = '';

      if ( this.IsIOS )
      {
        dir = this.file.documentsDirectory;
      }
      else if ( this.IsAndroid )
      {
        dir = this.file.dataDirectory;
      }

      dir = `${dir}${name.replace(/ /g, '')}`;

      const fileTransfer: FileTransferObject = this.transfer.create();

      fileTransfer.download(`${this.APIUrl}/${location}`, dir, true)
                  .then( ( f ) => 
                  {
                    this.fp.open( f.toURL(), mime ).then( () =>
                    {
                      console.log('File is opened')
                    } )
                    .catch(err =>
                    {
                      console.log('Open Error: ' + JSON.stringify( err ));
                    });

                    loading.dismiss();
                  }, ( error ) => 
                  {
                    console.log('Download Error: ' + JSON.stringify( error ));

                    loading.dismiss();
                  } );

    }
    catch( error )
    {
      console.log('General Error: ' + JSON.stringify( error ));
      loading.dismiss();
    }
  }

One thing to note though is that if I use the DocumentViewer plugin, it can open the PDF files. But I would like to use the FileOpener plugin as I intend to open other files other than PDFs.

Can anyone perhaps see what I am doing wrong?

Posts: 1

Participants: 1

Read full topic

Using Ionic with Vue?

$
0
0

@Dog2puppy wrote:

I’m trying to figure out how to use Ionic with Vue but I’m not really sure where or how to start.

Posts: 1

Participants: 1

Read full topic

Screen doesn't turn off

$
0
0

@behrooz2 wrote:

Hi,
My app doesn’t let the screen go to sleep neither on android nor on ios (after being inactive, no interaction with screen, for several minutes). I did not install any plugin to do so and am wondering why. Here is my config.xml file:

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.ionicframework.***" version="0.0.12" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>***</name>
    <description>****</description>
    <author email="***" href="">***</author>
    <content src="index.html" />
    <access origin="*" />
    <allow-navigation href="http://ionic.local/*" />
    <allow-navigation href="***" />
    <allow-navigation href="http://localhost:8080/*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
        <edit-config file="*-Info.plist" mode="merge" target="NSCameraUsageDescription">
            <string>To share photos on *</string>
        </edit-config>
        <edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryUsageDescription">
            <string>To share photos on *</string>
        </edit-config>
    </platform>
    <preference name="AllowInlineMediaPlayback" value="true" />
    <preference name="webviewbounce" value="false" />
    <preference name="UIWebViewBounce" value="false" />
    <preference name="DisallowOverscroll" value="true" />
    <preference name="android-minSdkVersion" value="16" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="SplashMaintainAspectRatio" value="true" />
    <preference name="FadeSplashScreenDuration" value="300" />
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
    <plugin name="cc.fovea.cordova.purchase" spec="^7.1.0">
        <variable name="BILLING_KEY" value="*****" />
    </plugin>
    <feature name="CDVWKWebViewEngine">
        <param name="ios-package" value="CDVWKWebViewEngine" />
    </feature>
    <feature name="StatusBar">
        <param name="ios-package" onload="true" value="CDVStatusBar" />
    </feature>
    <preference name="SplashScreen" value="screen" />
    <preference name="SplashScreenDelay" value="3000" />
    <plugin name="cordova-plugin-camera" spec="^3.0.0">
        <variable name="CAMERA_USAGE_DESCRIPTION" value="To Share Photos on *" />
        <variable name="PHOTOLIBRARY_USAGE_DESCRIPTION" value="To Share Photos on *" />
    </plugin>
    <plugin name="cordova-plugin-device" spec="^1.1.7" />
    <plugin name="cordova-plugin-file-transfer" spec="^1.7.0" />
    <plugin name="cordova-plugin-splashscreen" spec="^4.1.0" />
    <plugin name="cordova-plugin-statusbar" spec="^2.3.0" />
    <plugin name="cordova-sqlite-storage" spec="^2.1.4" />
    <plugin name="cordova-plugin-x-socialsharing" spec="5.4.1" />
    <plugin name="cordova-plugin-ionic-keyboard" spec="2.1.3" />
    <plugin name="cc.fovea.cordova.purchase" spec="^7.2.6" />
    <plugin name="cordova-plugin-inappbrowser" spec="3.0.0" />
    <plugin name="cordova-plugin-ionic-webview" spec="^3.1.2">
        <variable name="ANDROID_SUPPORT_ANNOTATIONS_VERSION" value="27.+" />
    </plugin>
    <plugin name="cordova-plugin-whitelist" spec="^1.3.3" />
    <plugin name="cordova-plugin-facebook4" spec="4.2.0">
        <variable name="APP_ID" value="*" />
        <variable name="APP_NAME" value="*" />
        <variable name="FACEBOOK_HYBRID_APP_EVENTS" value="false" />
        <variable name="FACEBOOK_ANDROID_SDK_VERSION" value="4.40.0" />
    </plugin>
    <engine name="ios" spec="4.5.5" />
    <engine name="android" spec="^7.1.4" />
</widget>

and ionic info:

Ionic:

   ionic (Ionic CLI)  : 4.10.3 (/usr/local/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4, ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 10 other plugins)

System:

   Android SDK Tools : 26.1.1 (/Users/Library/Android/sdk/)
   NodeJS            : v9.11.1 (/usr/local/Cellar/node/9.11.1/bin/node)
   npm               : 5.10.0
   OS                : macOS Mojave
   Xcode             : Xcode 10.1 Build version 10B61

Posts: 1

Participants: 1

Read full topic

Ionic 4 apk is bigger that version 3

$
0
0

@felipeblan wrote:

I just migrated an app that I have made using the version 3 of ionic framework, but now it is completely ported to the actual version (4). But i see that is almost double the size when i generate the apk; even in prod and release mod. Is that norma? or is there any suggestion to try to make it smaller?

Thanks.

Posts: 1

Participants: 1

Read full topic

Ionic-v4 VirtualScroll on screen orientation change

$
0
0

@arnhrwd wrote:

The IonVirtualScroll component does not update when the screen orientation changes. I have tried something like this, which was recommended in earlier versions of Ionic:

this.screenOrientation.onChange().subscribe(()=>{
    virtualScroll.readUpdate(true)
    virtualScroll.writeUpdate(true)
})

However those methods no longer exist in Ionic-v4 and I can’t find any other equivalent method. Is there one?

Posts: 1

Participants: 1

Read full topic

Validation toast for each input fields

$
0
0

@aseelali23 wrote:

I have a registration page, it contains some inputs and comboboxes. I need to push a toast when any of the comboboxes or inputs are not selected or entered and thet toast should show which is the field or check box that need to be entered.

      <ion-header>
    <ion-navbar>
        <ion-title>Basic Details</ion-title>
    </ion-navbar>
    </ion-header>

     <ion-content>
    <h1 class="h1">Basic Details</h1>
    <ion-row>
        <ion-col>
            <ion-input name="First Name" placeholder="First Name"></ion-input>
        </ion-col>
        <ion-col>
            <ion-input name="Last Name" placeholder="Last Name"></ion-input>
        </ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
            <ion-input name="Age" placeholder="Age"></ion-input>
        </ion-col>
        <ion-col>
            <ion-datetime displayFormat="MMM DD YYYY" placeholder="Date Of Birth"></ion- 
       datetime>
        </ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
            <ion-select interface="popover" placeholder="Height">
                <ion-option value="nes">4ft 8in</ion-option>
                <ion-option value="n64">4ft 9in</ion-option>
                <ion-option value="ps">5ft</ion-option>
                <ion-option value="genesis">5ft 1in</ion-option>
                <ion-option value="saturn">5ft 2in</ion-option>

            </ion-select>
        </ion-col>
        <ion-col>
            <ion-select interface="popover" placeholder="Weight(Kgs)">
                <ion-option value="nes">48Kgs</ion-option>
                <ion-option value="n64">49Kgs</ion-option>
                <ion-option value="ps">55Kgs</ion-option>
                <ion-option value="genesis">80Kgs</ion-option>
                <ion-option value="saturn">85Kgs</ion-option>
            </ion-select>
        </ion-col>
        <ion-col>
            <ion-select interface="popover" placeholder="Gender">
                <ion-option value="nes">Male</ion-option>
                <ion-option value="n64">Female</ion-option>
            </ion-select>
        </ion-col>
        </ion-row>


      <ion-row>
 
        <ion-col>
            <ion-select interface="popover" placeholder="Marital Status">
                <ion-option value="nes">Never Married</ion-option>
                <ion-option value="n64">Widowed</ion-option>
                <ion-option value="ps">Divorced</ion-option>
                <ion-option value="genesis">Awaiting Divorce</ion-option>
            </ion-select>
        </ion-col>
        <ion-col>
            <ion-select interface="popover" placeholder="Mother Tongue">
                <ion-option value="nes">Hindi</ion-option>
                <ion-option value="n64">Tamil</ion-option>
                <ion-option value="ps">Malayalam</ion-option>
                <ion-option value="genesis">English</ion-option>
            </ion-select>
        </ion-col>
        <ion-col>
            <ion-select interface="popover" placeholder="Eating Habits">
                <ion-option value="nes">Vegetarian</ion-option>
                <ion-option value="n64">Non-Vegetarian</ion-option>
            </ion-select>
        </ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
            <ion-select interface="popover" placeholder="Smoking Habits">
                <ion-option value="nes">No</ion-option>
                <ion-option value="n64">Occasionally</ion-option>
                <ion-option value="ps">Yes</ion-option>
            </ion-select>
        </ion-col>
        <ion-col>
            <ion-select interface="popover" placeholder="Drinking Habits">
                <ion-option value="nes">No</ion-option>
                <ion-option value="n64">Occasionally</ion-option>
                <ion-option value="ps">Yes</ion-option>
            </ion-select>
        </ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
            <button ion-button full color="secondary" block>Save</button>
        </ion-col>
        <ion-col>
            <button (click)="nxt()" ion-button full color="primary" block>Next</button>
        </ion-col>
    </ion-row>
     </ion-content>

ts file

     import { Component } from '@angular/core';
     import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic- 
    angular';
    import { ObsAuthService } from '../../services/obs_auth.services';
    import { MatrirelPage } from '../matrirel/matrirel';

    @Component({
    selector: 'page-matribas',
    templateUrl: 'matribas.html',
    
    providers: [ObsAuthService]
     })
    export class MatribasPage{
    constructor(private nav: NavController, private auth: ObsAuthService,
        private alertCtrl: AlertController, private loadingCtrl: LoadingController) {
        }

    selectChange(e) {
        console.log(e);
    }  
    public nxt(){
    this.nav.push(MatrirelPage);
    } 
    goback() {
            this.nav.pop();
    }   
    }

Posts: 2

Participants: 1

Read full topic


Streaming Media - Object(...) is not a function

$
0
0

@zkylab wrote:

Hi.
I already added “/ngx” to related imports but I still get ;

TypeError: Object(...) is not a function
    at StreamingMedia.playVideo (http://localhost:8100/build/vendor.js:82539:147)
    at HomePage.webpackJsonp.262.HomePage.play (http://localhost:8100/build/main.js:67:29)
    at Object.eval [as handleEvent] (ng:///AppModule/HomePage.ngfactory.js:37:27)
    at handleEvent (http://localhost:8100/build/vendor.js:13914:155)
    at callWithDebugContext (http://localhost:8100/build/vendor.js:15423:42)
    at Object.debugHandleEvent [as handleEvent] (http://localhost:8100/build/vendor.js:15010:12)
    at dispatchEvent (http://localhost:8100/build/vendor.js:10329:25)
    at http://localhost:8100/build/vendor.js:10954:38
    at HTMLButtonElement.<anonymous> (http://localhost:8100/build/vendor.js:40350:53)
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:15660)

home.html

<ion-header>
  <ion-navbar>
    <ion-title>
      Stream Media
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <button (click) = "play()">Play</button>
</ion-content>

home.ts

import { Component } from '@angular/core';
import {StreamingMedia,StreamingVideoOptions} from "@ionic-native/streaming-media/ngx";

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

  }
  play(){
    let options: StreamingVideoOptions = {
      successCallback: () => { console.log('Video played') },
      errorCallback: (e) => { console.log('Error streaming') },
      orientation: 'landscape',
      shouldAutoClose: true,
      controls: false
    };

    this.streamingMedia.playVideo('https://sample-videos.com/video123/mp4/720/big_buck_bunny_720p_2mb.mp4', options);
  }
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import {StreamingMedia} from "@ionic-native/streaming-media/ngx";

@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    StreamingMedia
  ]
})
export class AppModule {}

Thanks.

Posts: 3

Participants: 2

Read full topic

How to pass a parameter(logged user) to all the ionic pages

Ionic 4 virtual scroll - scroll to a specific element

$
0
0

@salehasadi1994 wrote:

Hi, I have a list of questions which should be rendered programmatically and unfortunately with dynamic height . in purpose of performance and get rid of lags I’m using ionic virtual scroll . the problem is that i have to implement jumping feature but since the target element is not rendered yet it can’t find that element and so it can’t scroll to that! i also tested ngx-virtual-scroller it’s scroll to target works perfectly but it does not support dynamic heights and don’t work perfectly if i don’t specify item height. does any body has any idea about this problem!? that’s killing me :disappointed_relieved:

Posts: 1

Participants: 1

Read full topic

Separate mobile and desktop code?

$
0
0

@pefe wrote:

I’m currently using Ionic 4 to make the mobile apps. with usages of cordova native plugins i know it won’t work with the desktop platform. should i continue to use ionic for desktop/browser and just add platform.is(‘cordova’) to not execute any cordova native plugins? or is there a better way to handle this? or i might need to write another angular project targeting browser?

Posts: 2

Participants: 2

Read full topic

Tap-target-view in ionic 4

Add, edit or delete the features in a page

$
0
0

@neenu123 wrote:

I have a subscription page consist of 3 cards, in which on selecting each card a button is enabled. This button is used to edit or add items to the page. Please helpme with the code to edit the items in the page.
html code

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

<ion-content>
    <ion-item>
        <ion-buttons end>
            <button ion-button [disabled]="!isenabled" class="add_buttn" (click)="add_page()">Add/Edit</button>
        </ion-buttons>
    </ion-item>
    <ion-label class="sentnc">Take your desired plan to get access to our content easily</ion-label>
    <ion-row>
        <ion-col col2>
            <ion-card  (click)="onCardClick()">
                    <!-- <div *ngIf="cardClicked"></div> -->
                <ion-card-content>
                    <ion-card-title class="titles">
                        FREE
                    </ion-card-title>
                    <p>1 MONTH FREE</p>
                    <p>&nbsp;</p>
                    <p class="cost">₹0</p>
                    <p>&nbsp;</p>
                    <p>
                        <button (click)="free_pay()" ion-button color="dark" round>Choose plan</button>
                    </p>
                </ion-card-content>
            </ion-card>
        </ion-col>

        <ion-col col2>
            <ion-card (click)="onCardClick()">
                <ion-card-content>
                    <ion-card-title class="titles">
                        CLASSIC
                    </ion-card-title>
                    <p>6 MONTHS PLAN</p>
                    <p><del>₹150</del></p>
                    <p class="cost">₹100<sub>/month</sub></p>
                    <p>&nbsp;</p>
                    <p>
                        <button (click)="classic_pay()" ion-button color="dark" round>Choose plan</button>
                    </p>
                </ion-card-content>
            </ion-card>
        </ion-col>

        <ion-col>
            <ion-card (click)="onCardClick()">
                <ion-card-content>
                    <ion-card-title class="titles">
                        PREMIUM
                    </ion-card-title>
                    <p>1 YEAR PLAN</p>
                    <p><del>₹250</del></p>
                    <p class="cost">₹200<sub>/month</sub></p>
                    <p>&nbsp;</p>
                    <p>
                        <button (click)="premium_pay()" ion-button color="dark" round>Choose plan</button>
                    </p>
                </ion-card-content>
            </ion-card>
        </ion-col>
    </ion-row>
</ion-content>

ts file

import { Component } from '@angular/core';
import { NavController, NavParams, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular';
import { ObsAuthService } from '../../services/obs_auth.services';
import { JobsearchPage } from '../jobsearch/jobsearch';
import { ConnectpayPage } from '../connectpay/connectpay';


@Component({
    selector: 'page-jobsub',
    templateUrl: 'jobsub.html',
    providers: [ObsAuthService]
})


export class JobsubPage {

     public category: string = "CLASSIC";
     public subscription: string = "PREMIUM";
     public option: string ="";
    //  public cardClicked: boolean = false;
     isenabled:boolean=false;
     editItem: any;
    //  public price: string ="";
    //  public p1: string = "₹100";
    //  public p2: string = "₹200";

    constructor(private nav: NavController, private auth: ObsAuthService,
        private alertCtrl: AlertController, private loadingCtrl: LoadingController,
        public navParams: NavParams) { }

    selectChange(e) {
        console.log(e);
    }

//redirect to job search page
    public free_pay(){
        this.nav.push(JobsearchPage);
    }

//proceed to payment page
    public classic_pay(){

        this.nav.push(ConnectpayPage, {option: this.category});
    }

//proceed to payment page
    public premium_pay(){
        this.nav.push(ConnectpayPage, {option: this.subscription});
    }

//to enable the edit button
    public onCardClick(){
        //  this.cardClicked = !this.cardClicked;
        this.isenabled=true;
        this.editItem()
    }

    // public add_page(){

    // }
}

scss

page-jobsub{

.sentnc{
    color: grey;
    padding: 40px 10px;
    text-align: center;
}
.card-md {
    
    // width: calc(25% - 20px);
    font-size: 1.4rem;
    text-align: center;
    // background: rgb(192, 179, 167);
}
.cost{
    font-weight: bolder;
}
.titles{
    color: crimson;
    font-weight: bolder;
}
.add_buttn{
    // width: 15%;
    // background-color: red;
    padding: 10px 15px;
    // text-decoration-color: white;
   width: 10%;
    
}

}

Posts: 2

Participants: 1

Read full topic

How to read sms using IONIC 4?

$
0
0

@akashpjames wrote:

Is there any way to read SMS when it arrives using IONIC 4? I need to trigger some actions when the incoming message has a specific text. I saw this cordova-sms-plugin, but it can only send SMS. Any help in this regard would be helpful. I don’t need ios support, just Android support. I see many apps reading my messages, but why can’t I do it with IONIC?

Posts: 1

Participants: 1

Read full topic


[Ionic V4]How to remove last-child bottom border of ion-item in Ionic4

$
0
0

@avex wrote:

For Ionic V4,
how do you remove end line of last child of ion-items using css?
No scripts please!

<ion-button (click)="advanceOpts=!advanceOpts;">

<ion-list>
  <ion-item>
    <ion-label>Item1</ion-label>
    <ion-input></ion-input>
  </ion-item>
  <ion-item>
    <ion-label>Item2</ion-label>
    <ion-toggle slot="end"></ion-toggle>
  </ion-item>
  <ion-item *ngIf="advanceOpts">
    <ion-label>Item3</ion-label>
    <ion-radio slot="end"></ion-radio>
  </ion-item>
  <ion-item *ngIf="advanceOpts">
    <ion-label>Item4</ion-label>
    <ion-checkbox slot="start"></ion-checkbox>
  </ion-item>
</ion-list>

Posts: 1

Participants: 1

Read full topic

App store require Documents for authorized to distribute the content

$
0
0

@ebeliejinfren wrote:

Hi
i publish my application on app store but it’s not accepted in several time and the reviewer request for the document for authorized to distribute the content
but i don’t know how to document ?

the app store reviewer Answer :

Thank you for your message. Please respond with documentation attached, using the upload feature, evidencing that Jenyar has been authorized to distribute the content owned by the artists. Once Legal has reviewed your documentation and confirms its validity, we will proceed with your application review.

please if anybody know about this guide me
Thanks

Posts: 1

Participants: 1

Read full topic

App crashes on device when executing http request but working on browser

$
0
0

@scriline wrote:

Hi guys !

Something very strange happens currently on my app. I’m trying to execute a http get request with my app and it works perfectly on my browser, but when I try it on my android device, it crashes.
Actually, everything works perfectly until I click the “calcul” button I created. At this very moment the app closes and well, I’ve got no hint what it can be linked to.

Searching on forums, I tried to remove and install again android platform but didn’t change anything…

Here you have my ionic info, the code where I execute the http request and a strange error I’m getting for a few days, it may be related to that…

Thanks for your help !

Posts: 1

Participants: 1

Read full topic

Few questions about ionic 4

$
0
0

@IAmos wrote:

Hi

I’m new to Ionic and wanted to ask several things:

  1. Is there a way to use this component in Ionic? https://github.com/sujithkanna/SmileyRating
    If not, is there a similar component in Ionic?

  2. I have a thermometer component. The name suggests its features and purpose, is there something similar in Ionic?

  3. Can I develop once in Ionic and use the app for both mobile and web? Do I need a special hosting to run ionic as a web application?

  4. I’m using VSCode. Are there any special addons I should download before starting to develop in Ionic?

  5. Can I use Ionic with Firebase/FireStore/Authentication?

Thanks

Posts: 1

Participants: 1

Read full topic

Dismiss Loading Component when HTTP request finish

$
0
0

@irvingprog wrote:

HI Everyone

I was trying to figure out how to make the LoadingControlller work with an HTTP request. I didn’t find a solution to this in the forum or stackoverflow.

Thinking a little bit i find this way to: fire Loading component -> make an HTTP request > hide loading component.

import { HttpClient } from '@angular/common/http';
import { LoadingController } from '@ionic/angular';
import { from } from 'rxjs';
....
  ngOnInit() {
    from(this.presentLoading())
    .subscribe(() => {
      this.http.get(url) 
      .subscribe(
        (data) => {
          console.log(data);
        },
        (error) => {
          console.log(error)
        }
      )
      .add(() => this.loading.dismiss());
    });
  }

  private async presentLoading(): Promise<any> {
    this.loading = await this.loadCtrl.create({
      message: 'Please wait ...',
    });
    return await this.loading.present();
  }
}

This is working and it solved my problem but i want to know if my solution is correct and if there is a better way to do it.

Related: (None of the solutions there worked for me)
https://forum.ionicframework.com/t/dismiss-a-loadingcontroller/141148
https://github.com/ionic-team/ionic/issues/15109

Ionic:

   ionic (Ionic CLI)             : 4.9.0 (/usr/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.2
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.2.4
   @ionic/angular-toolkit        : 1.4.0

System:

   NodeJS : v11.7.0 (/usr/bin/node)
   npm    : 6.7.0
   OS     : Linux 4.4

I really appreciate any comments you can provide.

Posts: 1

Participants: 1

Read full topic

Viewing all 48980 articles
Browse latest View live


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