问题描述
我想使用@ViewChild从父组件访问子组件功能,但显示“未定义”错误。
我正在尝试实现ngx-infinite-scroll,将滚动应用于父AppComponent,并且当用户向下滚动到底部(滚动)时会触发父AppComponent中的“ onScroll”功能。
因此,“ onScroll”切换了子组件中的ngx-spinner的可见性,并且从api提取所有数据并通过子组件开始进行渲染。
请帮助!!!
父组件: AppComponent
儿童组件: .// current / posts / post-card / post-card.component
PARENT-> AppComponent.ts
import { Component,ViewChild} from '@angular/core';
import {PostCardComponent} from './current/posts/post-card/post-card.component';
@Component({
selector: 'app-root',templateUrl: './app.component.html',styleUrls: ['./app.component.css']
})
export class AppComponent
{
@ViewChild(PostCardComponent) child: PostCardComponent ;
constructor(){}
onScroll(){
console.log("----scrolled-----");
this.child.showSpinner();
}
}
儿童-> PostCardComponent
import { Component,OnInit} from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import {Title} from "@angular/platform-browser";
import { HttpClient } from '@angular/common/http';
import { NgxSpinnerService } from 'ngx-spinner';
@Component({
selector: 'app-post-card',templateUrl: './post-card.component.html',styleUrls: ['./post-card.component.css']
})
export class PostCardComponent implements OnInit {
received = 'none';
posts: any = [];
constructor(private http: HttpClient,public spinner: NgxSpinnerService){}
ngOnInit(){
this.loadInitPosts();
}
public showSpinner(){
this.spinner.show();
}
loadInitPosts(){
const url = 'http://localhost/api/getPosts.PHP;
this.http.get(url).subscribe(data => {
this.posts = data;
this.received='success';
},error =>
{
this.received='error';
});
}
}
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)