September 11, 2018, 9:12 pm
@bholub1 wrote:
Maybe it’s too soon and there’s nothing like this out there yet, but I’d really love to see a tutorial/example of an app built with the Ionic PWA Toolkit that has auth… but not firebase/okta/other auth library.
I’ve looked at the Stencil Beer app: https://github.com/jgw96/stencil-beer – But that uses firebase, and it just shows a login screen first by default, if you go directly to other routes it doesn’t redirect to login.
I’ve read the Okta tutorial: https://developer.okta.com/blog/2018/04/16/add-auth-to-your-pwa-with-okta-and-stencil – but that uses another auth library, and I want to understand what’s going on inside better… .but this is probably the closest to what I’m looking for so far.
The app I’m creating uses the Ionic PWA toolkit with a split pane UI. But I’d like to require authentication before getting to that point. I have an existing API that I’ll be calling for authentication… so I won’t be using firebase/okta or any other auth provider. I guess my questions are: how can the user state be shared among all pages; can the auth check happen in the root component, or does it need to happen in each “page” component.
Any direction would be greatly appreciated!
Thanks,
Brian
Posts: 3
Participants: 3
Read full topic
↧
September 11, 2018, 10:20 pm
@cikcoh wrote:
Hi,
this is how my tabs.html
<ion-tabs tabsPlacement=“top” [selectedIndex]=“tab_index”>
<ion-tab tabIcon=“megaphone” [root]=“tab1Root” tabsHideOnSubPages=“true”>
<ion-tab tabIcon=“eye” [root]=“tab2Root” tabsHideOnSubPages=“true”>
<ion-tab tabIcon=“notifications” [tabBadge]=“badgeCounter” [root]=“tab3Root” tabsHideOnSubPages=“true”>
<ion-tab tabIcon=“menu” [root]=“tab4Root” tabsHideOnSubPages=“true”>
this is my tab.ts
this.tab_index = this.navParams.get(‘tabIndex’)
if i want to navigate from other pages to specific tab:
this.nav.setRoot(TabsPage,{tabIndex: 0});
the right icon tab is highlighted
but when i navigate from tab to tab by clicking each tab icon, it goes to the right tab, but it highlighted the wrong tab icon
Posts: 1
Participants: 1
Read full topic
↧
↧
September 11, 2018, 11:48 pm
@bobotong wrote:
I cannot set $range-md-tick-height:15px; for the android.
However, I can set $range-ios-tick-height:15px; for ios.
Please help as the UI for android is not same as ios.
Posts: 1
Participants: 1
Read full topic
↧
September 11, 2018, 11:50 pm
@keanallen wrote:
Ionic v1 app failed to build android.
I tried to edit my DistributionURL to 4.1 but everytime I run it changes to 3.x, and when i try to see my DistributionUrl it is still 4.x. Why?
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 12:17 am
↧
↧
September 12, 2018, 12:25 am
@Timmytaku wrote:
I am trying to scan a QR code from an Image. Preciously i have implemented getting qrData from the QR using QR Camera. Now i want to be able to scan from an Image and then get qrData. Is it possible? and how can i do that?
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 1:01 am
@dipankar123 wrote:
Hi guys,
I want to change ion-item background color when ion-item clicked/pressed.
like this picture below
i know ion-checkbox will solve my problem but i want this
here is my code
html:
<ion-list>
<button ion-item [ngStyle]="{'background-color': mybackcolor}" *ngFor="let type of people" (press)="utPeople(type)">
<ion-avatar item-start>
<img *ngIf="type.utilityImage==''" src="assets/imgs/img_avatar2.png">
<img *ngIf="type.utilityImage!=''" [src]="type.utilityImage">
</ion-avatar>
<h2>{{type.UtilityName}}</h2>
<p>{{type.UtilityMob}}</p>
<p>{{type.Rating}} <ion-icon name="star"></ion-icon></p>
</button>
</ion-list>
in ts:
utPeople(type){
console.log(type);
this.mybackcolor = '#c5c5c5;'
}
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 2:13 am
@vladsazonov wrote:
Hi!
I’m aware that there must not be CORS issues when I run app on the real device, but it’s happening in my project.
I’ve been using ionic cordova run android command and also tried to install app manually via ADB in order to run the app only on real device, but no results so far.
To prevent possible questions - I’m not able to change backend.
I’m using ionic v4, project is built with angular v6.
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 2:20 am
@loveenaamebasoftware wrote:
Hello Forum
I m trying to install camera and intent plugin in my version 1 project but app got crash at very first place.
Thanks
Posts: 1
Participants: 1
Read full topic
↧
↧
September 12, 2018, 2:22 am
@richardshergold wrote:
Does anyone have ANY idea why this code (which runs fine on an iOS 9 device, an iOS 10.3.3 device and an iOS 11 device) on an iOS 10.3.2 device fails with the error shown below?:
let alert = this.alertCtrl.create({
title: "hello",
subTitle: "please display",
buttons: ['OK']
});
console.log("Here we go....");
alert.present()
.then(() => {
console.log("displayed ok");
})
.catch((error) => {
console.log("error:", error);
})
console.log("Done");
Console:
Here we go.....
error: NetworkError (DOM Exception 19): A network error occurred.
Done
Does anyone know if 10.3.2 is a version of iOS that has known issues with Ionic/Cordova? Could it be the actual device itself that causes this - it seems a bit odd?
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 2:27 am
@amr229 wrote:
I have an ionic app that I’m working on, everything works perfectly normal locally and on genymotion android emulator, but when I build it for android, it just gives me a grey screen not even loading the splash screen, then it crashes. I tried --aot, --prod, --release then signing with my keystore, nothing works. I updated all the dependencies, redid the src folder on a new app, it worked then did the same thing unexpectedly.
My ionic info
Ionic:
ionic (Ionic CLI) : 4.1.2 (/home/amr/.nvm/versions/node/v10.9.0/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.1.9
Cordova:
cordova (Cordova CLI) : 8.0.0
Cordova Platforms : android 7.0.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.2, cordova-plugin-ionic-webview 2.0.2, (and 14 other plugins)
System:
Android SDK Tools : 26.1.1 (/home/amr/Downloads/SDK)
NodeJS : v10.9.0 (/home/amr/.nvm/versions/node/v10.9.0/bin/node)
npm : 6.2.0
OS : Linux 4.13
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 3:03 am
@irok84 wrote:
I recently updated Ionic and now something strange happens: I can’t type in console.
When I started new project with ionic start new <project>, it asked me about various things (eg whether to use cordova) and pressing Y or N did not give any result.
Now I’m trying to link app with Ionic pro (ionic link --pro-id <id>) and I can enter my e-mail address, but I can’t enter my password, I type (or paste) password and press enter and nothing happens.
Any ideas?
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 3:05 am
@rvsingh011 wrote:
I am new to ionic and was trying some luck with making components. I got to know we can share components through a shared component So I made some pages one of which is “About”.
I have made a component “menu-list” which I want to show on About page. Here is the code.
Menu-list.ts
import { Component } from '@angular/core';
/**
* Generated class for the MenuListComponent component.
*
* See https://angular.io/api/core/Component for more info on Angular
* Components.
*/
@Component({
selector: 'menu-list',
templateUrl: 'menu-list.html'
})
export class MenuListComponent {
text: string;
constructor() {
console.log('Hello MenuListComponent Component');
this.text = 'Hello World';
}
}
component modules ( sharing through component) - components.module.ts
import { NgModule } from '@angular/core';
import { MenuListComponent } from './menu-list/menu-list';
import { IonicModule } from 'ionic-angular';
@NgModule({
declarations: [MenuListComponent],
imports: [IonicModule],
exports: [MenuListComponent]
})
export class ComponentsModule {}
about.module.ts
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { AboutPage } from './about';
import { ComponentsModule } from '../../components/components.module';
@NgModule({
declarations: [
AboutPage,
],
imports: [
IonicPageModule.forChild(AboutPage),
ComponentsModule
],
})
export class AboutPageModule {}
In about.html i am calling but it gives error -
Error: Template parse errors: ‘menu-list’ is not a known element: 1. If ‘menu-list’ is an Angular component, then verify that it is part of this module. 2. If ‘menu-list’ is a Web Component then add ‘CUSTOM_ELEMENTS_SCHEMA’ to the ‘@NgModule.schemas’ of this component to suppress this message. (" <ion-content padding> <h1>This is me</h1> [ERROR ->]<menu-list></menu-list> </ion-content> "): ng:///AppModule/AboutPage.html@17:2 at syntaxError (http://localhost:8100/build/vendor.js:78110:34) at TemplateParser.parse (http://localhost:8100/build/vendor.js:102298:19) at JitCompiler._parseTemplate (http://localhost:8100/build/vendor.js:112253:37) at JitCompiler._compileTemplate (http://localhost:8100/build/vendor.js:112228:23) at http://localhost:8100/build/vendor.js:112129:62 at Set.forEach (<anonymous>) at JitCompiler._compileComponents (http://localhost:8100/build/vendor.js:112129:19) at http://localhost:8100/build/vendor.js:111999:19 at Object.then (http://localhost:8100/build/vendor.js:78099:77) at JitCompiler._compileModuleAndComponents (http://localhost:8100/build/vendor.js:111998:26)
What I am doing wrong?
Posts: 1
Participants: 1
Read full topic
↧
↧
September 12, 2018, 3:13 am
@Mc123321 wrote:
I am trying to add a label between two datetime element, but the label always goes to the left before the first datetime input.
<ion-item>
<ion-label>Time:</ion-label>
<ion-datetime displayFormat="YYYY-MM-DD" placeholder="Start"></ion-datetime>
<span style="display: inline-block;vertical-align: middle;">To</span>
<ion-datetime displayFormat="YYYY-MM-DD" placeholder="End"></ion-datetime>
</ion-item>
Posts: 2
Participants: 2
Read full topic
↧
September 12, 2018, 3:13 am
@tejakumar wrote:
Getting error while running ionic app.
ERROR in @ionic-native\call-number\index.ts(25,2): Error during template compile of ‘CallNumber’
Only initialized variables and constants can be referenced in decorators because the value of this variable is needed by the template compiler in ‘Plugin’
‘Plugin’ references ‘Plugin’
‘Plugin’ is not initialized at @ionic-native\core\decorators\interfaces.ts(100,22).
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 3:15 am
@1BJK903 wrote:
Hi all,
I have seen tons of snippets, but they are all for Ionic 2+. I am using the old Ionic and want to know if there is a way to show a spinner or pre-loading image or something before the actual image is loaded?
Thanks for the help!
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 4:11 am
@ahmadklsany wrote:
hello programmers . ![:slightly_smiling_face:]( ":slightly_smiling_face:")
i have a problem in my app in cordova-plugin-firebase-dynamiclinks when i try add this plugin >>>this error appear …
D:\ionic\basabiso>ionic cordova plugin add cordova-plugin-firebase-dynamiclinks --save --variable APP_DOMAIN=“basabiso.com” --variable APP_PATH=“basabiso.page.link”.
(node:8376) UnhandledPromiseRejectionWarning: CordovaError: Variable(s) missing (use: --variable PAGE_LINK_DOMAIN=value).
at Object.mergeVariables (C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\src\cordova\plugin\util.js:77:15)
at C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\src\cordova\plugin\add.js:104:40
at _fulfilled (C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\node_modules\q\q.js:787:54)
at self.promiseDispatch.done (C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\node_modules\q\q.js:816:30)
at Promise.promise.promiseDispatch (C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\node_modules\q\q.js:749:13)
at C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\node_modules\q\q.js:557:44
at flush (C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\node_modules\q\q.js:108:17)
at _combinedTickCallback (internal/process/next_tick.js:131:7)
at process._tickCallback (internal/process/next_tick.js:180:9)
(node:8376) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:8376) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
this is my ionic info
Ionic:
** ionic (Ionic CLI) : 4.1.2 (C:\Users\ahmadklsany\AppData\Roaming\npm\node_modules\ionic)**
** Ionic Framework : ionic-angular 3.9.2**
** @ionic/app-scripts : 3.2.0**
Cordova:
** cordova (Cordova CLI) : 8.0.0**
** Cordova Platforms : android 7.0.0**
** Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.2, cordova-plugin-ionic-webview 2.1.3, (and 12 other plugins)**
System:
** Android SDK Tools : 25.2.3 (C:\Users\ahmadklsany\AppData\Local\Android\sdk)**
** NodeJS : v8.11.4 (C:\Program Files\nodejs\node.exe)**
** npm : 5.6.0**
** OS : Windows 10**
this is my plugins list
card.io.cordova.mobilesdk 2.1.0 “CardIO”
com.paypal.cordova.mobilesdk 3.5.0 “PayPalMobile”
cordova-android-support-gradle-release 1.4.4 “cordova-android-support-gradle-release”
cordova-plugin-camera 4.0.3 “Camera”
cordova-plugin-device 2.0.2 “Device”
cordova-plugin-file 6.0.1 “File”
cordova-plugin-file-transfer 1.7.1 “File Transfer”
cordova-plugin-filepath 1.4.2 “cordova-plugin-filepath”
cordova-plugin-firebase 2.0.0 “Google Firebase Plugin”
cordova-plugin-ionic-keyboard 2.1.2 “cordova-plugin-ionic-keyboard”
cordova-plugin-ionic-webview 2.1.3 “cordova-plugin-ionic-webview”
cordova-plugin-network-information 2.0.1 “Network Information”
cordova-plugin-splashscreen 5.0.2 “Splashscreen”
cordova-plugin-statusbar 2.4.2 “StatusBar”
cordova-plugin-whitelist 1.3.3 “Whitelist”
cordova-plugin-x-socialsharing 5.4.1 “SocialSharing”
es6-promise-plugin 4.2.2 “Promise”
Posts: 1
Participants: 1
Read full topic
↧
↧
September 12, 2018, 4:14 am
@adedeoglu wrote:
Hi gurus!
While i was working on my app, i decided to use web-photo-filter plugin.
I followed the tutorial and
“./components module is not found” error occured.
Could you tell me what might be this issue about?
( One more guy commented on tutorial about same issue ).
Thanks.
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 4:43 am
@karvanj wrote:
Playing around Ionic 4 and I have some very newbie questions.
-
Declaring Services
So in Ionic 3 I would declare my providers in app.module.ts, @NgModule -> providers. However I noticed in Ionic 4 this is not required? That is I can just import them directly into the page or component. Is this correct? If two components are using the same service would they still share the same instance of the service?
-
Global Css Classes
I would declare css classes in app.scss in Ionic 3. Where would I declare global css classes this now?
Sorry in advance if these are very obvious questions…got to start somewhere
Posts: 1
Participants: 1
Read full topic
↧
September 12, 2018, 4:56 am
@Arcsama wrote:
Ionic commands work, but when i type $cd projectname, then ionic commands does not working.
‘ionic’ is not recognized as an internal or external command,
operable program or batch file.
Posts: 2
Participants: 2
Read full topic
↧
