angular – 如何从离子2中另一个组件的模板调用组件的功能

前端之家收集整理的这篇文章主要介绍了angular – 如何从离子2中另一个组件的模板调用组件的功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想从另一个组件的模板中调用组件的功能

离子2.我使用home.ts在我的app dashboard.html中获取一个仪表板

零件.

<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>

这是在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')

        );
}

现在,我想从仪表板组件调用学生组件功能

我创建了学生组件,如students.ts

@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");
    }
}

解决方法

如果您的studentcomponent是仪表板的直接子项,则可以使用viewchild.

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

在你的组件中:

@ViewChild('student') student: StudentComponent

猜你在找的Angularjs相关文章