は私が</p> <p>イオン2.Iに別のコンポーネントのテンプレートからコンポーネントの関数を呼び出すにしたいどのようにイオン2

Question

に別のコンポーネントのテンプレートからコンポーネントの機能を呼び出すために私のアプリダッシュボードにでダッシュボードを取得します。 html using home.ts

コンポーネント。

<ion-content> 
<div class="dashboardSection"> 

      <a href="" (click)="fetchAllClass()"> 
       <div class="header padding text-center classes common"> 
        <img src="assets/images/icos_15.png" alt="Your logo here" width="50%" height="auto"/> 
        <p class="Sectiontitle">STUDENTS</p> 
       </div> 
      </a></div> 
</ion-content> 

これは今、私はダッシュボードのコンポーネント

から学生component'functionを呼びたい、私はstudents.tsのような学生のコンポーネントを作成しhome.ts

doLogin(event) {  
    var user1 =this.loginForm.value; 
    var password = this.loginForm.controls.password.value; 
    this.homeService.doLogin(user1).subscribe(
     user =>{ 
      this.user = user.results; 
      this.storage.set('isLoggedIn', 'shahjad'); 
      this.navCtrl.setRoot(DashboardComponent, {thing1: user }); 
     }, 
     err => { 
      console.log(err); 
     }, 
     () => console.log('login complete') 

     ); 
} 

の助けを借りて見せています

@Component({ 

    selector: 'page-students', 
    templateUrl: "./students.html" 
}) 
export class StudentsComponent { 
    dashboardItem: any; 
    mode = "Observable"; 
    errorMessage: string; 

    constructor(public fb: FormBuilder,private studentsService: StudentsService,public navCtrl: NavController,private storage: Storage,private menu: MenuController) {} 

    fetchAllClass(event) { 

     alert("fd"); 
    } 
} 

Answer 1

あなたは間違いなくshoul d Angularのサービスとhow to build a custom oneを見てください。 thread about this hereが表示されます。

基本的には、注入物を作成し、それをあなたのNgModule（またはシュレッドモジュール）に追加してから、それを使用する必要があるコンポーネントに注入します。 その他偉大なtutorialはこちらです。

Answer 2

プロバイダを作成し、そこにデータを取得するすべての関数を配置する必要があります。これにより、プロバイダを簡単にインポートして、必要な場所にデータを簡単に取得できます。より多くの場合

、あなたのstudentcomponentはあなたがviewchildを使用できるダッシュボードの直接の子である場合this post

Answer 3

を参照してください。

<page-student #student></page-student>

あなたにコンポーネント：

@ViewChild('student') student: StudentComponent

Answer 4

• まず、多くのコンポーネントで関数を作成して使用するための最良の方法は、serviceを使用しています。

• 第二に、あなたはまだ他のコンポーネント内の関数を呼び出したい場合、あなたはそのように行うことができます。
  

ステップ1：DashboardComponentであなたのStudentComponentを注入：

import { Component,Inject,forwardRef } from '@angular/core'; 
import {StudentComponent} from '../component/students' 
@Component({ 
    selector: 'dashboard', 
    templateUrl: 'dashboard.html', 
    providers:[StudentComponent] 
}) 
constructor(@Inject(forwardRef(() => StudentComponent))private studentComponent: StudentComponent){ 
} 

ステップ2 ：今、あなたはStudentComponentの関数を呼び出すことができます。

fetchAllClass(event) { 
this.studentComponent.fetchAllClass(event); 
} 

ステップ3：あなたは、テンプレートに新しいfetchAllClass関数を呼び出すことができます。

<a href="" (click)="fetchAllClass()">