@RobeNogueira145 wrote:

Hello, I´m beginner at Ionic and I´m developing a app and this app requires databases. I´ll use sqlite but I don´t know how to use, anyone have a example or website to follow instructions?

Posts: 1

Participants: 1

Read full topic

@sheikhm wrote:

i’m working with ionic printer plugin and rendering html(content) from ts, but it seems like only html native tags are working, can i use ionic tags like ion-grid?

Posts: 1

Participants: 1

Read full topic

@pabloo87 wrote:

Hi, i’m trying to modify ionic side menu animation adding a blur filter to the app when menu’s showed. In order to do so, i’m using a angular directive. I already made the desired effect except the transition duration as it change when the menu opens/closes and the platform is ios or Android.
The directive class is like this:

export class BlurMenuDirective {

  constructor(private el: ElementRef) {
    this.setBackdropFilter('None');
  }

  @HostListener('ionWillOpen') ionWillOpen() {
    this.setBackdropFilter('blur(2px)');
  }

  @HostListener('ionWillClose') ionWillClose() {
    this.setBackdropFilter('None');
  }

  setBackdropFilter(value) {
    this.el.nativeElement.style.backdropFilter = value;
  }
}

I’ve been an hour looking for an answer. Any ideas? It doesn’t matters if i have to hard code the timing to the class or i access programmatically to it.

Posts: 1

Participants: 1

Read full topic

@arjunatantri wrote:

hi everyone,
I’m writing separate shared library which follow to this article:
https://devdactic.com/ionic-multi-app-shared-library/

however, when i try to lazy load the library, i got error stating:
ERROR RangeError: Maximum call stack size exceeded

can anyone please advise ?

thank you

Posts: 1

Participants: 1

Read full topic

@actiumtech wrote:

Hi,

as the v2 of Capacitor is released, is there any plan to support Web for Push notifications?

Thanks.

Posts: 1

Participants: 1

Read full topic

@codiqa100036932 wrote:

Hi

We have a app with amplify and ionic ( 5.4.9, below more info) . All works fine , s3, auth , analitycs , admin queries , auth .

But with auth and Federated Social Login we have problems with Android , on Web works fine.

We singup with Google Federated HostedUI on Cognito pools and auth works fine, but when can back to us we capture with deeplinks , and deeplinks trigger ok .

On next step when redirect from deeplinks to page for use , amplify detect SignIn with “A user Google_103030042694745594198 has been signed in” , that is ok.

But after that give us a error like this :

Failed to execute ‘replaceState’ on ‘History’: A history state object with URL 'com.movilgate.awslogin://app/auth/signin/'

We have an exception in this step and call Auth.currentAuthenticatedUser() , but we don’t know if that is ok , and is very ugly method .

Exists any example o technique for this works fine on android ?

ionic info :

Ionic:

Ionic CLI : 5.4.9 (/Users/mtoro/.ionic/Studio/Tools/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 5.0.7
@angular-devkit/build-angular : 0.803.26
@angular-devkit/schematics : 8.3.26
@angular/cli : 8.3.26
@ionic/angular-toolkit : 2.2.0

Cordova:

Cordova CLI : 9.0.3 (cordova-lib@9.0.2)
Cordova Platforms : android 8.1.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 5 other plugins)

Utility:

cordova-res : 0.6.0 (update available: 0.11.0)
native-run : 0.2.8 (update available: 1.0.0)

System:

NodeJS : v12.16.1 (/Users/mtoro/.nvm/versions/node/v12.16.1/bin/node)
npm : 6.13.4
OS : macOS Catalina
Xcode : Xcode 11.3.1 Build version 11C504

Posts: 1

Participants: 1

Read full topic

@Sweg wrote:

In my Ionic 5 app, I am trying to push a Message object into an array located within a Conversation object.

Here are the models I’m using:

export class Conversation {
    constructor(
        public id: string,
        public userId: string,
        public mechanicId: string,
        public messages: Message[]
    ) { }
}

export class Message {
    constructor(
        public id: string,
        public text: string,
        public userId: string,
        public timestamp: Date
    ) { }
}

I am able to create a new Conversation with the below code:

addConversation(mechanicId: string, message: string) {
    const newConversation = new Conversation(
      Math.random().toString(),
      this.authService.userId,
      mechanicId,
      [this.createMessage(message)]
    );
    return this.conversations.pipe(
      take(1),
      delay(1000),
      tap(conversations => {
        this._conversations.next(conversations.concat(newConversation));
      }));
  }

  private createMessage(message: string): Message {
    return {
      id: Math.random().toString(),
      text: message,
      userId: this.authService.userId,
      timestamp: new Date(Date.now())
    };
  }

But I am trying to push a new Message object into an existing Conversation object below:

addToConversation(id: string, mechanicId: string, message: string) {
    const conversation = this.getConversation(id);
    if (conversation) {
      conversation.messages.push(
        this.createMessage(message)
      );
    }
  }

But I’m getting this console error:

Property ‘messages’ does not exist on type Observable<{ id: string, userId: string, mechanicId: string, messages: Message; }>

Can someone please tell me how I can add a new Message to an existing Conversation using this method?

Posts: 1

Participants: 1

Read full topic

@Sweg wrote:

In my Ionic 5 / Angular app, I am displaying some items in an <ion-virtual-scroll> below.

I am retrieving loadedMessages from a ConversationsService which I am calling from my Typescript you can see below also:

<ion-virtual-scroll [items]="loadedMessages">
    <ion-item-sliding *virtualItem="let message" #slidingItem>
        <ion-item>
            <ion-label>
                <h2>{{ message.text}}</h2>
            </ion-label>
        </ion-item>
    </ion-item-sliding>
</ion-virtual-scroll>

On the same page, I have the below form. When the user fills out this form, they add a new Message to the Conversation, they are able to do this using the conversation.id.

    <form [formGroup]="form">
        <ion-item>
            <ion-textarea formControlName="message"></ion-textarea>
        </ion-item>
        <ion-button (click)="onSendMessage()">Send</ion-button>
    </form>

Here is my Typescript:

ngOnInit() {
    this.route.paramMap.subscribe(paramMap => {
      this.conversationsSub = this.conversationsService
        .getConversation(paramMap.get('conversationId'))
        .subscribe(conversation => {
          this.conversation = conversation;
          this.loadedMessages = this.conversation.messages;
          this.mechanic = this.usersService.getUserByUserId(this.conversation.mechanicId);
          this.form = new FormGroup({
            message: new FormControl(null, {
              updateOn: 'blur',
            })
          });
        });
    });
  }
  onSendMessage() {
    this.conversationsService.addMessageToConversation(this.conversation.id, this.form.value.message);
  }

As I mentioned, if I navigate to a different page, & then navigate back to Conversation-Detail, the <ion-virtual-scroll> shows the updated messages, but I want the scroll to update as soon as the user clicks the Send button, & the Message is added.

And here is my ConversationsService:

export class ConversationsService {

  private _conversations = new BehaviorSubject<Conversation[]>([
    new Conversation(
      'conversation1',
      'user3',
      'user1',
      [
        new Message('message1', 'Test message', 'user3', new Date(2018, 0O5, 0O5, 17, 23, 42, 11)),
        new Message('message2', 'Another message', 'user1', new Date(2018, 0O6, 0O5, 17, 23, 42, 11))
      ]),
    new Conversation(
      'conversation2',
      'user4',
      'user2',
      [
        new Message('message3', 'my  message', 'user4', new Date(2018, 0O7, 0O7, 17, 23, 42, 11)),
        new Message('message4', 'more messages', 'user2', new Date(2018, 0O7, 0O7, 17, 23, 42, 11)),
      ])
  ]);

  get conversations() {
    return this._conversations.asObservable();
  }

  constructor(private authService: AuthService, private usersService: UsersService) { }

  private createMessage(message: string): Message {
    return {
      id: Math.random().toString(),
      text: message,
      userId: this.authService.userId,
      timestamp: new Date(Date.now())
    };
  }

  getConversation(id: string) {
    return this.conversations.pipe(
      take(1),
      map(conversations => {
        return { ...conversations.find(conversation => conversation.id === id) };
      }));
  }

  getConversationToAddMessage(id: string) {
    return this._conversations.getValue().find(conversation => conversation.id === id);
  }  

  addMessageToConversation(conversationId: string, message: string) {
    this.getConversationToAddMessage(conversationId).messages.push(this.createMessage(message));
  }

  addConversation(mechanicId: string, message: string) {
    const newConversation = new Conversation(
      Math.random().toString(),
      this.authService.userId,
      mechanicId,
      [this.createMessage(message)]
    );

    return this.conversations.pipe(
      take(1),
      delay(1000),
      tap(conversations => {
        this._conversations.next(conversations.concat(newConversation));
      }));
  }
}

Can someone please tell me how I can resolve this problem? I can provide further context if required also. Thanks a lot!

Posts: 1

Participants: 1

Read full topic

@basti wrote:

Hi, I want wo insert data on mysql. With the native HTTP plugin it’s no problem to insert data via GET.
But I want to do a POST request and there always just comes this strange error (couldn’t find something about this online):

{"__zone_symbol__currentTask":{"type":"microTask","state":"notScheduled","source":"Promise.then","zone":"angular","cancelFn":null,"runCount":0}}

Ionic code:

let postData = new FormData()
  postData.append('s_id',this.s_id)
  postData.append('klasse',this.klasse.id)
  postData.append('stunde',this.stunde.id)
  postData.append('uebungen',JSON.stringify(this.uebungen))
  postData.append('wo_id',woid)

const options = {
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    }
};

this.http.post(
      'URL.php/', 
      postData,
      options
     )
     .then(response => {
        // prints 200
        console.log("Response-Status: "+response.status);
        try {
          response.data = JSON.parse(response.data);
          // prints test
          console.log("Response-Message: "+response.data.message);
        } catch(e) {
          console.error('JSON parsing error');
        }
     })
     .catch(response => {
       // prints 403
       console.log("Response: "+JSON.stringify(response));
      }
     });

And here my PHP code to insert the values in mysql:

$neuer_user = array();
$neuer_user['s_id'] = $_POST['s_id'];
$neuer_user['klasse'] = $_POST['klasse'];
$neuer_user['stunde'] = $_POST['stunde'];
$neuer_user['user'] = $_POST['wow_id'];
$neuer_user['uebungen'] = $_POST['uebungen'];
 
$statement = $pdo->prepare("INSERT INTO wot (s_id,klasse,stunde,user,uebungen) VALUES (:s_id, :klasse, :stunde, :user, :uebungen)");
$statement->execute($neuer_user);

If I use this with GET it works, but with POST not…

Posts: 1

Participants: 1

Read full topic

@Sandeep776 wrote:

Hi,
i am trying to build my ionic app using the (Ionic cordova build android) but the occur every time while build android.
Error:-

android757×543 93.6 KB

strings.xml file :-

<?xml version='1.0' encoding='utf-8'?>
<resources>
    <string name="app_name">MyApp</string>
    <string name="launcher_name">@string/app_name</string>
    <string name="activity_name">@string/launcher_name</string>
    <string name="google_app_id">@string/google_app_id</string>
    <string name="google_api_key">@string/google_api_key</string>
</resources>

values.xml file:-

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="default_web_client_id" translatable="false">338850216501-l7679q2l5ft530fctce3ovjgc9o1r3me.apps.googleusercontent.com</string>
    <string name="firebase_database_url" translatable="false">https://bfit-gym.firebaseio.com</string>
    <string name="gcm_defaultSenderId" translatable="false">338850216501</string>
    <string name="google_api_key" translatable="false">"My Api Key"</string>
    <string name="google_app_id" translatable="false">"My Api id"</string>
    <string name="google_crash_reporting_api_key" translatable="false">AIzaSyBMmrqrdJ680nzHo_EbYWPWJhZf_f-P6Z8</string>
    <string name="google_storage_bucket" translatable="false">bfit-gym.appspot.com</string>
    <string name="project_id" translatable="false">bfit-gym</string>
</resources>

Posts: 1

Participants: 1

Read full topic

@brown34 wrote:

I am needing some help on making links work on IONIC program. I have a very good understand of web coding. However, this is not helping me with IONIC. My professor has not been much help. I have also research like 15 websites and still luck. I just need to make the links work. Below is the layout of the menu bar coding.

<!----- bottom menu ----->
<ion-tabs>
  <ion-tab-bar slot="bottom">


    <ion-tab-button>
      <ion-icon name="restaurant-sharp"></ion-icon>
      <ion-label>Home</ion-label>
    </ion-tab-button>

    <ion-tab-button>
      <ion-icon name="map-sharp"></ion-icon>
      <ion-label>Search</ion-label>
    </ion-tab-button>

    <ion-tab-button>
      <ion-icon name="calendar-sharp"></ion-icon>
      <ion-label>MyTables</ion-label>
      <ion-badge>3</ion-badge>
    </ion-tab-button>

    <ion-tab-button>
      <ion-icon name="calculator-sharp"></ion-icon>
      <ion-label>M-2</ion-label>
    </ion-tab-button>
      
    <ion-tab-button>
      <ion-icon name="aperture-sharp"></ion-icon>
      <ion-label>M-4</ion-label>
    </ion-tab-button>

      
    </ion-tab-bar>
</ion-tabs>
<!----- end of bottom menu ----->

When I try a code the professor suggested (below) and I save. Both the iOD and Android preview screen just go pitch black.

    <ion-tab-button (click)="navigate()">
      <ion-icon name="restaurant-sharp"></ion-icon>
      <ion-label>Home</ion-label>
    </ion-tab-button>

Please I need someone help. Once I get this I think I am able to create my own pages.

Posts: 1

Participants: 1

Read full topic

@tkclark wrote:

Having issues which I’ve seen posted on here before but no real solution was given. Sometimes, not the majority of the time, I navigate to a page and it’s blank. I inspect the elements and everything is there, but ion-page has a class called ion-page-invisible on it. Not sure why?

I am using a tab based navigation system with a router. Any ideas what is happening? I see this in Chrome and in iOS.

Posts: 1

Participants: 1

Read full topic

@bmsantos wrote:

I’ve been trying to display the contents of a page on a sub ion-router-outlet but so far to no avail.

Sample project:
https://github.com/bmsantos/router-outlet-issue

The primary router-outlet is usually found in app.component.html and used to load the initial router contents:

<ion-app>
    <ion-router-outlet name="primary"></ion-router-outlet>
</ion-app>

In the sample app, you will find that the app.routing.module.ts will drive the app to a simulated login page. Once the user logs in, the app will route to members -> dashboard and place the new page in the primary router-outlet. The dashboard routing is defined in members-routing.module.ts.

app.routing.module.ts:

const routes: Routes = [
  {
    path: '',
    redirectTo: 'login',
    pathMatch: 'full',
  },
  {
    path: 'login',
    loadChildren: () => import('./pages/public/auth/login/login.module').then(m => m.LoginPageModule),
  },
  {
    path: 'members',
    canActivate: [AuthGuard],
    loadChildren: './members/member-routing/member-routing.module#MemberRoutingModule',
  }
];

@NgModule({
  imports: [
    RouterModule.forRoot(routes, {preloadingStrategy: PreloadAllModules, useHash: true})
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {
}

members-routing.module.ts:

const routes: Routes = [
  {
    path: 'dashboard',
    loadChildren: () => import('../../pages/dashboard/dashboard.module').then( m => m.DashboardPageModule),
  },
];

@NgModule({
  declarations: [],
  imports: [
    RouterModule.forChild(routes),
    CommonModule,
  ],
  exports: [
    RouterModule
  ]
})
export class MemberRoutingModule {
}

The dashboard page is just a ion-slipt-pane with a left menu and a secondary ion-router-outlet. The goal is to display the pages or components routed from the menu on the left into the secondary router-outlet.

<ion-content>
  <ion-split-pane contentId="pages-content">
    <ion-menu contentId="pages-content" type="overlay">
      <ion-content>
...
      </ion-content>
    </ion-menu>

    <ion-router-outlet id="pages-content" name="secondary"></ion-router-outlet>

  </ion-split-pane>
</ion-content>

The dashboard-routing.module.ts routes the requested page to be displayed in the secondary router-outlet and the page for folder/Add option is supposed to be rendered in the secondary outlet.

dashboard-routing.module.ts:

const routes: Routes = [
  {
    path: '',
    component: DashboardPage
  },
  {
    path: 'folder/Add',
    loadChildren: () => import('../../pages/add-event/add-event.module').then(m => m.AddEventPagePageModule),
    outlet: 'secondary'
  },
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
})
export class DashboardPageRoutingModule {}

When the app is executed you can either trigger this option by clicking Trigger Link button or + Add option from the menu.

            <ion-button *ngIf="isFirst" expand="block"
                        [routerLink]="[{ outlets: { secondary: ['folder', 'Add']} }]"
                        routerDirection="forward"
            >Test Link</ion-button>

The resulting app link is properly generated and no error appear in the console:

http://localhost:8100/#/members/dashboard/(secondary:folder/Add)

The page is not loaded though and I’m not sure what I’m doing wrong or if this is a legit issue in Ionic 6.

Any idea, thanks

Posts: 1

Participants: 1

Read full topic

@AIBug wrote:

I’m looking at the ionic conference app example. When my internet browser reaches a certain width (about 3/4 of my screen) on my computer, the menu side bar opens automatically and remains open. I can’t find in the code what activates it and how to stop it. Anyone know how to stop it from opening?

Posts: 1

Participants: 1

Read full topic

@YXUN wrote:

Hi guys, so I place my PDF folder in my src/assets folder and I am struggling to display it in my app.

I tried using

• Iframe
• Embed
• Object

But none work. Any advice? Using Google Docs is not an option because I want users to be able to view PDF without access to the internet.

Thanks in advance for any help I can get.

Posts: 1

Participants: 1

Read full topic

@mehraj786 wrote:

IMG_20200410_101417720×1520 233 KB

hi can anyone know how can i change close position i am using photo viewer plugin i want to change the close (X) position to top right

Posts: 1

Participants: 1

Read full topic

@itosoft wrote:

how can i logout from my github account in ionic when try to link project to appflow

? Which git host would you like to use? GitHub

[INFO] In order to link to a GitHub repository the repository must already exist on GitHub.
[INFO] If the repository does not exist please create one now before continuing.

       If you're not familiar with Git you can learn how to set it up with GitHub here:

       https://help.github.com/articles/set-up-git/

       You can find documentation on how to create a repository on GitHub and push to it here:

       https://help.github.com/articles/create-a-repo/
? Does the repository exist on GitHub? Yes
√ Looking up your GitHub repositories: 7 found - done!
? Which GitHub repository would you like to link?
  itosoftco / amnasnad-beta
> itosoftco / amnasnad-lite
  itosoftco / amnasnad-lts
  itosoftco / ghghbh6
  itosoftco / null
  itosoftco / qrcodei
  itosoftco / qrscanner

i want to disaccount itosoftco from ionic link?

Posts: 1

Participants: 1

Read full topic

@AIBug wrote:

I am working on the Ionic Conference app example and I’m trying to change the active tab colors, but no matter what i try from online, the active tabs remain blue and the inactive ones grey… i’m not sure why i can’t change them. Anyone have an idea?

Posts: 1

Participants: 1

Read full topic

@mehraj786 wrote:

Capture295×532 18.5 KB

can anyone know why it is selecting multiple menu if i click particular menu and coma back again if i click other menu it is selecting like this.
i amusing ionic 4 angular 8

Posts: 1

Participants: 1

Read full topic

@Lyhout wrote:

hi, guy, I got an issue with Video youtube player error in IOS. it 's not work at all.
Does anyone have a solution?

Posts: 1

Participants: 1

Read full topic