Angular＆Flexislider-初始化问题？

Question

我遇到了一个问题，即滑块/ carasoul始终无法工作，我认为这与初始化方式有关。

它可以在90％的时间内工作，但是不会加载任何图像。在检查元素时，我可以看到html中显示了图像，但是浏览器中没有显示滑块或图像。不知道我在做什么错。

DataService：

  getSlider() : Observable<PictureModel[]>{
var results = this.http.get<PictureModel[]>(this.SliderUrl,httpOptions);  
return results;

}

组件：

  pictures: PictureModel[];
  recentWork: RecentWorkModel[];

  async ngOnInit() {
    this.dataService.getSlider()
      .subscribe(pictures => {
        this.pictures = pictures;
        this.initSlider();

      });
  }

  initSlider() : void{
    $(window).on('load', function() {

      $('.flexslider').flexslider({
          animation: "slide",
          slideshow: true,          
          start: function(slider){
            $('body').removeClass('loading')
          }
      });  
      $('img').bind('contextmenu', function(e) {
        return false;
      }); 
    });

  }

模板：

<div class="flexslider">
      <ul class="slides">

        <li *ngFor="let picture of pictures">
            <a routerLink="/galleryItem/{{picture.giid}}"><img src={{picture.path}} alt={{picture.name}} /></a>
        </li>

      </ul>
    </div>