Quantcast
Channel: Ionic Forum - Latest topics
Viewing all 71531 articles
Browse latest View live
↧

Ionic4 Datetime component sets minutes to current time

March 15, 2019, 1:18 pm
$
0
0

@rodrigojrmartinez wrote:

I’m using a datetime component meant to show hours, I’m attaching its value to a form. I wish the input to be empty until you click on it, for which the hours should be open and set at 8:00 hours, this works fine locally but when deploying it over a server and checking on browser it always sets the minutes to the current time.

<ion-datetime formControlName="hourStart" display-format="HH:mm" picker-format="HH:mm"
              [pickerOptions]="hourStartOptions" (click)="setInitialStartHour()">
</ion-datetime>

  private minHour = {
    hour: { text: '08', value: 8, columnIndex: 0 },
    minute: { text: '00', value: 0, columnIndex: 1 }
  };

   public setInitialStartHour() {
    if (isUndefined(this.absenceForm.controls['hourStart'].value)) {
        this.form.controls['hourStart'].setValue(this.minHour);
        this.form.controls['hourStart'].updateValueAndValidity();
    }
  }

hours
hours.png545×834 15.6 KB

Is there a way to avoid this from happening? Shouldn’t the datetime picker be set to its value?

Posts: 1

Participants: 1

Read full topic

↧
Search

Ion-range with dual knobs displaying currency format numbers

March 15, 2019, 1:22 pm
$
0
0

@Damiano12345 wrote:

I’m developing a form in which i use a dual knobs input type range to indicate a price interval .

I need a solution that allows me to show the price variation on the knobs with a currency format , ex: 5.000,00$.
I have tried with pin=“true” but I don’t know how to format the text through this attribute.

Thank you

Posts: 1

Participants: 1

Read full topic

↧
↧

Static website with IONIC (?)

March 15, 2019, 2:38 pm
$
0
0

@jddk wrote:

Hello,
I’m sorry about how basic my question might be. I started with Ionic but I actually partnered with someone who is doing all the programming work and legwork.

We are at the point now where the application that will work on tablets and phones is almost ready. But some of that functionality will integrate with a website. The website will have 5-6 static pages and 2 sections where they will integrate with the mobile apps. The question is what you recommend:

  1. Creating a full website in Ionic/Firebase so the 2 sections that will share features are easily integrated, but 5-6 static pages built in Ionic as well?
  2. Build the website in some other platform (ideally a CMS like WordPress) and just share the 2 sections where they will integrate with Ionic. (How would we do that…because the Ionic developer says all he can do is give me a link. Then the websites and Apps would be in separate servers…I guess that’s ok, but is that the recommended way?)
  3. Other integration?

I’m sorry for this basic question which is not really purely IONIC!

Thank you very much for your help!!

Posts: 1

Participants: 1

Read full topic

↧

Ionic side menu annoying problem

March 15, 2019, 5:23 pm
$
0
0

@Fares95 wrote:

Hello ,
i wanted to make a side menu but after this the page appCompnent.html do not work anymore , please help !

<ion-app>
  <ion-split-pane>
    <ion-menu >
      <ion-header>
        <ion-toolbar>
          <ion-title>Menu</ion-title>
        </ion-toolbar>
      </ion-header>
      <ion-content>
        <ion-list>
          <ion-side-menu auto-hide="false" *ngFor="let p of appPages">
            <ion-item [routerDirection]="'root'" [routerLink]="[p.url]">
              <ion-icon slot="start" [name]="p.icon"></ion-icon>
              <ion-label>
                {{p.title}}
              </ion-label>
            </ion-item>
          </ion-side-menu>
        </ion-list>
        
      </ion-content>
    </ion-menu>
    <ion-router-outlet main></ion-router-outlet>
  </ion-split-pane>
</ion-app>

i wanted that enu to be side and which i can hide

Posts: 2

Participants: 2

Read full topic

↧

Deleting for an array (may be a defect)

March 15, 2019, 5:48 pm
$
0
0

@makarchus wrote:

I am trying to build a functionality to have user get a list with checkbox and number of elements they choose, I need to delete it.

When I select all items to delete, the last item does not get deleted. here is my code

currentProductlinks: Productlink;
deletedLink: Productlink;

deleteFromCart(){
this.deletedLink=this.currentProductlinks
for(let links of this.currentProductlinks){
if(links.selected){
this.deletelinks(links)
}
}
this.storage.set(‘emailLinks’, this.deletedLink)
this.currentProductlinks = this.deletedLink
}

deletelinks(item:any){
for(let links of this.deletedLink){
var index = this.deletedLink.indexOf(links)
this.deletedLink.splice(index,1)
}

I believe array gets resize and the one item gets pushed upwards in an array and skips that one element.

Let me know how to address this issue in IONIC/Angular

Posts: 1

Participants: 1

Read full topic

↧
↧

Ionic 4 - View not push up when keyboard is shown

March 15, 2019, 8:33 pm
$
0
0

@sereyvuthy wrote:

Hi, I am having a problem regarding to a view not push up when keyboard is shown, so I cannot key in the field that keyboard render over, please help

Posts: 1

Participants: 1

Read full topic

↧

Ionic 3 ios not splash image not applied

March 16, 2019, 12:11 am
$
0
0

@pdj wrote:

41
스크린샷 2019-03-16 16.05.41.png2302×953 157 KB

as you can see above…I added almost all image to images.xcassets folder on xcode…(I also did it on resources folder on ionic directory…)
but it only appeared default ionic splash image…

so…I added on LaunchStoryboard but it is shown really weirdly on my phone like stretched one.

44
스크린샷 2019-03-16 16.08.44.png2432×605 39.4 KB

first question is that just adding image to LaunchImage on images.xcassets on xcode should work isn’t it?

second question is that at least it is shown image by adding image on LaunchStoryboard…
but what is really weird is that
when I launch app , it shows default image for 0.5~1sec (but without loading spinner) then show splash image.

KakaoTalk_Photo_2019-03-16-16-10-30
KakaoTalk_Photo_2019-03-16-16-10-30.jpeg539×960 16 KB

Posts: 1

Participants: 1

Read full topic

↧

//ionic167.rssing.com/chan-53730645/article46668-live.html

March 16, 2019, 12:25 am
↧
Search

[Ionic V4] how do you put text under icon in ionicV4? Button

March 16, 2019, 3:10 am
$
0
0

@avex wrote:

How do you put text under icon in ionic V4?
Before Ionic v4, it’s very easy to do that, but I have no idea to accomplish such kind of easy thing in Ionic v4.
Plz help ~

      <ion-button>
        <ion-icon name="add"></ion-icon>
        <span>Add</span>
      </ion-button>

Posts: 1

Participants: 1

Read full topic

↧
↧

CORS issue because ionic is running on ionic://localhost on mobile device

March 16, 2019, 3:18 am
$
0
0

@Dnlut wrote:

I have an issue when using the Google Drive API on a mobile device (iOS). I am using the GooglePlus native plugin to obtain an access token.

However when I make the actual call it is blocked by CORS of the GoogleAPI because ionic://localhost cannot be added as a trusted domain in the GoogleAPI.

I there anyone who maybe has a solution to this problem? Like is it possible to just use the ‘http’ schema instead of ‘ionic’ on mobile?

Posts: 1

Participants: 1

Read full topic

↧

Ionic calendar issues

March 16, 2019, 5:35 am
↧

Individual NPM packages

March 16, 2019, 6:58 am
$
0
0

@ollie-w wrote:

Are there plans to publish Ionic components as individual NPM packages? I like the components but find the framework as a whole too overreaching.

For example, I am not planning to use Ionic for Routing, I could happily forgo using the menu components, yet I get this error when trying to use Ionic/React on an app that uses Reach Router.
Module not found: Error: Can't resolve 'react-router
In other cases I might want to make a site with only server-side routing.

It is also very prescriptive about how you structure your app and it applies many global styles.
For example:

body {
    background: var(--ion-background-color);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    position: fixed;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    text-rendering: optimizeLegibility;
    overflow: hidden;
    touch-action: manipulation;
    -webkit-user-drag: none;
    -ms-content-zooming: none;
    word-wrap: break-word;
    overscroll-behavior-y: none;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none;
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
 margin-top:16px;
 margin-bottom:10px;
 font-weight:500;
 line-height:1.2
}
h1 {
 margin-top:20px;
 font-size:26px
}
h2 {
 margin-top:18px;
 font-size:24px
}
h3 {
 font-size:22px
}
h4 {
 font-size:20px
}
h5 {
 font-size:18px
}
h6 {
 font-size:16px
}

This approach is probably helpful for people who want their app to look good without need to write much CSS.
However, as somebody who is good at CSS and who may want a very boutique layout, I’d rather have full control over things like this. With Ionic I need to override things, often using !important, not knowing how this might effect Ionic components that rely on these styles.

What I want is a bunch of nice-looking well-built premade components. Ionic provides that, but it touches too much and involves itself too broadly for my personal taste.
Also, I am building a web site not a Native app, so don’t need Capacitor.

Posts: 1

Participants: 1

Read full topic

↧

[ionic4] How to close FAB button in ionic4

March 16, 2019, 7:41 am
$
0
0

@pantarmj wrote:

How to close FAB button in ionic4… my code was working in ionic 3 to close FAB button but the same code is not working in ionic4… my code is given below:

<ion-fab vertical="bottom" horizontal="end" slot="fixed" #fab>
		<ion-fab-button color="primary">
			<ion-icon name="ios-options"></ion-icon>
		</ion-fab-button>
		<ion-fab-list side="top">
			<ion-fab-button (click)="openSort(fab)"><ion-icon name="md-funnel"></ion-icon></ion-fab-button>
			<ion-fab-button (click)="openFilter(fab)"><ion-icon name="ios-funnel"></ion-icon></ion-fab-button>
		</ion-fab-list>		
	</ion-fab>

        openFilter(fab) {		
		fab.close();    // this is not working in ionic 4
		this.router.navigateByUrl('filter-listing');
	}

	openSort(fab) {		
		fab.close();  // this is not working in ionic 4
		his.router.navigateByUrl('sort-listing');		
	}

Posts: 1

Participants: 1

Read full topic

↧
↧

[ionic4] ion-reorder is not working in ionic4

March 16, 2019, 7:46 am
$
0
0

@pantarmj wrote:

ion-reorder is not working in ionic4… it was working in ionic3… some help pls… my code is given below:

<ion-item-group reorder="true" (ionItemReorder)="imageOrderChanged($event)"> 
		<ion-item *ngFor="let obj of arrImgObjects; let i=index;" style="border-bottom: 0;">
			<!-- <ion-row> -->
				<ion-thumbnail slot="start">
					<img src="{{obj.Variations.ThumbCrop.Asset.DateStamp+'/'+obj.Variations.ThumbCrop.Asset.Reference | imgUrlPipe}}" alt="image" style="height:6em; width:6em;">
				</ion-thumbnail>
				<div>
					<ion-button expand="full" (click)="rotateImage(i, obj.GUID)" style="background-color:lightblue;">ROTATE
						<ion-icon name="redo" style="color:black; margin-left:5px;"></ion-icon>
					</ion-button>
					<ion-button expand="full" (click)="deleteImage(i, obj.GUID)" style="background-color:lightblue; margin-top:20px;">DELETE
							<ion-icon name="trash" style="color:black; margin-left:5px;"></ion-icon>
					</ion-button>
				</div>
			<!-- </ion-row> -->
		</ion-item>        
	</ion-item-group>

imageOrderChanged(reorderEvent) {
		reorderArray(this.arrImgObjects, reorderEvent);
		reorderArray(this.arrImageGuid, reorderEvent);
	}

Posts: 1

Participants: 1

Read full topic

↧

Ionic build - cordova_not_available on device

March 16, 2019, 10:28 am
$
0
0

@voidbrain wrote:

Hello Ionites,
anyone else got problems with last release of Ionic CLI?
When i run on devices (iOS/android) i get cordova_not_available on (@angular/common/http) http requests and (@ionic/angular) QR reader plugin calls.
What’s wrong?

sudo npm install -g ionic@latest
/Users/voidbrain/.npm-global/bin/ionic -> /Users/voidbrain/.npm-global/lib/node_modules/ionic/bin/ionic
+ ionic@4.12.0
updated 1 package in 14.231s

But ionic info returns 4.9:

Ionic:

   ionic (Ionic CLI)             : 4.9.0 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.1.1
   @angular-devkit/build-angular : 0.13.6
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.3.6
   @ionic/angular-toolkit        : 1.4.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-add-swift-support 1.7.2 "AddSwiftSupport"
cordova-plugin-device 2.0.2 "Device"
cordova-plugin-ionic-keyboard 2.1.3 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 3.1.2 "cordova-plugin-ionic-webview"
cordova-plugin-network-information 2.0.1 "Network Information"
cordova-plugin-qrscanner 2.6.0 "QRScanner"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"

System:

   NodeJS : v11.8.0 (/usr/local/bin/node)
   npm    : 6.5.0
   OS     : macOS Mojave
   Xcode  : Xcode 10.1 Build version 10B61

Posts: 1

Participants: 1

Read full topic

↧
Search

Ionic v4 Http get

March 16, 2019, 11:22 am
$
0
0

@Gerdes wrote:

Hi there,

I´m using inoic 4 and want to make a simple http get but I alwas get Access to XMLHttpRequest at ‘MY_API_LINK’ from origin ‘https://192.168.178.21:8100’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

I´m using a Asp.Net Api with basic authentication. I also tried a Chrome plugin to disable cors.

I hope that someone can help me cause I´m really frustrated

Greetings Felix

Posts: 1

Participants: 1

Read full topic

↧

How to print this kind of json data in console

March 16, 2019, 11:34 am
↧
↧

Unable to sign apk

March 16, 2019, 12:11 pm
$
0
0

@bedanta1998 wrote:

I’m unable to generate signed apk. Here re the error messages I’m getting -
When I entered this command

$ jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore keystore_name.keystore unsigned.apk alias_name

I got this error-

Enter Passphrase for keystore:jarsigner error: java.lang.RuntimeException: keystore load: G:\codecaynon\new good\ionic-2-app-woo_v44\app\keystore.keystore (The system cannot find the file specified)

Posts: 1

Participants: 1

Read full topic

↧

Ionic 4, Firebase and Searchbar

March 16, 2019, 1:16 pm
$
0
0

@AmberS wrote:

Hi, I need help with using the searchbar to find the names from Firebase. I have successfully been able to list all of the names from Firebase, but I am having trouble with searching Firebase for a certain name.

home.page.html

<ion-content>
    <ion-searchbar (ionInput)="getItems($event)"></ion-searchbar>
  <ion-list>
    <ion-item-sliding *ngFor="let info of infos">
      <ion-item detail lines="full" routerLink="/detail/{{info.key}}">
        <ion-icon name="desktop" slot="start"></ion-icon>
        {{info.info_name}}
      </ion-item>
    </ion-item-sliding>
  </ion-list>
</ion-content>

home.page.ts- I am able to see the name that I am entering in the searchbar with the console.log.

 export class HomePage {

  infos = [];
  ref = firebase.database().ref('infos/');

  public infosList:Array<any>;
  public loadedInfoList:Array<any>;

  constructor(private route: ActivatedRoute, public router: Router, public alertController: AlertController) {
    this.ref.on('value', resp => {
      this.infos = [];
      this.infos = snapshotToArray(resp);

      this.infosList.forEach(info =>{
        this.infos.push(info.val());
        return false;

      });
    });
    this.infosList = this.infos;
    this.loadedInfoList = this.infos;
   
  }

  initializeItems(){
    this.infosList = this.loadedInfoList;
  }

   getItems(ev: any) {
    // Reset items back to all of the items
    this.initializeItems();
    
    // // set q to the value of the searchbar
    // var q = searchbar.srcElement.value;
    let q = ev.target.value;

    // if the value is an empty string don't filter the items
    if (!q) {
      return;
    }

    this.infosList = this.infosList.filter((info) => {
      if(info.info_name && q) {
        if (info.info_name.toLowerCase().indexOf(q.toLowerCase()) > -1) {
          return true;
        }
        return false;
      }
    });

    console.log(q, this.infosList.length);

  }
}

export const snapshotToArray = snapshot => {
  let returnArr = [];

  snapshot.forEach(childSnapshot => {
      let item = childSnapshot.val();
      item.key = childSnapshot.key;
      returnArr.push(item);
  });

  return returnArr;
}

Posts: 1

Participants: 1

Read full topic

↧

New app Service Finder

March 16, 2019, 3:40 pm
$
0
0

@obinnae wrote:

After about 3 years of on-off developing and learning Ionic, I’ve finally launched my first Ionic v3 app. Service Finder is an app for connecting to nearby service providers (businesses) for your needs, and for businesses to easily connect to customers. Ideal for small businesses & contractors, as well as regular users like you and I. Kinda like AngiesList, but eBay style.

Feel free to download it from servicefinderapp.com and spread the word!
Send any feedback here or at info@servicefinderapp.com.

Currently available in US, Canada, UK and Australia. Other countries coming soon.

screenshot
screenshot.jpg1080×1920 163 KB

Posts: 1

Participants: 1

Read full topic

↧
Viewing all 71531 articles
Browse latest View live
Search