I have a problem with Ionic3

0

I'm learning how to use Ionic as an example so I'm following a course. I created an intro with 3 slides that in the end I created a "Click" to go to Tabs, with Home and feed, but the Feed stopped working, when I click I will not go any more

Feed.html

See link 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);
  }

}
    
asked by anonymous 04.08.2018 / 06:28

1 answer

0

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

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

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

    
04.08.2018 / 14:27