I have a problem with Ionic3

Asked

Viewed 183 times

0

I’m learning to use the Ionic, as an example for that I’m taking a course. I created an intro with 3 slides that at the end I created a "Click" to go to Tabs, with Home and feed, but the feed stopped working, when I click will no more

Feed.html

See http://ionicframework.com/docs/components/#navigation for more info on Ionic pages and navigation. -->

Feed 

<ion-item>
  <ion-avatar item-start>
    <img src="assets/imgs/avatar.png">
  </ion-avatar>
  <h2 class="feed_title">{{ nome_usuario }}</h2>
  <p class="feed_descr">November 5, 1955</p>
</ion-item>

<img src="assets/imgs/advance-card-bttf.png">

<ion-card-content>
  <p>Programar em Ionic é perfeito.</p>
</ion-card-content>

<ion-row>
  <ion-col>
    <button ion-button icon-start clear small>
      <ion-icon name="thumbs-up"></ion-icon>
      <div>12 Likes</div>
    </button>
  </ion-col>
  <ion-col>
    <button ion-button icon-start clear small>
      <ion-icon name="text"></ion-icon>
      <div>4 Comments</div>
    </button>
  </ion-col>
  <ion-col center text-center>
    <ion-note>
      11h ago
    </ion-note>
  </ion-col>
</ion-row>


import { Component } from '@angular/core';

import { AboutPage } from '../about/about';
import { ContactPage } from '../contact/contact';
import { HomePage } from '../home/home';
import { FeedPage } from '../feed/feed';
import { IntroPage } from '../intro/intro';

@Component({
  templateUrl: 'tabs.html'
})
export class TabsPage {

  tab1Root = HomePage;
  tab2Root = FeedPage;
  tab3Root = IntroPage;
  constructor() {

  }
}

different files

<ion-tabs>
  <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
  <ion-tab [root]="tab4Root" tabTitle="Feed" tabIcon="ios-paper-outline"></ion-tab>
</ion-tabs>

different files

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

/**
 * Generated class for the FeedPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-feed',
  templateUrl: 'feed.html',
})
export class FeedPage {
  public nome_usuario:string = "Wesley Israel App";
  constructor(public navCtrl: NavController, public navParams: NavParams) {
  }

  public somadoisnumeros(num1:number, num2:number): void{
    alert(num1 + num2);

  }

  ionViewDidLoad() {
    //this.somadoisnumeros(12, 5);
  }

}

ionic

1 answer

0

Ionic 3 uses Lazy loading to load pages, which helps improve the application’s opening time. I’m seeing from the code on the Feed page that you created Ionic appeal, probably from the command line, using ionic g page feed. Therefore, you will need to call the page not by component, but by name (string). In the feed.module.ts file, add the following:

@NgModule({
  ...
  ],
  exports: [
    FeedPage
  ]

In the tabs.ts file, change tab2Root = FeedPage; for tab2Root = "FeedPage";.

Browser other questions tagged ionic

You are not signed in. Login or sign up in order to post.