如何解决滚动到图像阵列中的选定图像的问题?

问题描述

我在子组件中有一组图像,在父组件中有一组相同的图像。 当我在子组件中选择一张图像时,我希望在父组件中找到数组中的图像并滚动到它。

我在服务中使用BehaviorSubject获取选定的图像,但是我无法解决在父组件中使用选定的值并滚动到数组中的图像的问题。

这是我父组件中的内容

selectedImg: Image;
images: Image[] = [];
@input() selIm: Image;

@ViewChildren('someId') someId: QueryList<ElementRef>;

ngOnInit() {
    this.myservice.selectedImage.subscribe(selected => {
        this.selectedImg = selected; /// getting selected image from child component
      });

    this.images = this.myservice.getimages(); // getting all images from service
} 

ngAfterViewInit() {

    this.someId.changes.subscribe(x=> {
           this.someId.toArray().map(y=>{
             y.nativeElement.querySelector('someClass').scrollIntoView();
           })
    })

}

在我的模板中,我有

   <div class="someClass" *ngFor='let img of images;' #someId [selIm] ="selectedImg">
      <img src="{{img.link}}" />
  </div>

我尝试使用@ViewChildren,但始终收到未定义的错误。 谢谢!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)