在角度2中使用自举滑块，动态数据滑块不起作用

Question

＆＃13;

＆＃13;

import { Component, OnInit } from '@angular/core';
import { TreandingNewsServices } from '../services/trending-news-services';
@Component({  
  selector: 'app-home',
  templateUrl: './home.component.html',
  styles: []
})
export class HomeComponent implements OnInit {

  trendingNewData:any[];

  constructor( private trendingSerNews: TreandingNewsServices ) { }

  ngOnInit() {

    this.trendingNewData = this.trendingSerNews.getTrenNews();

  }

}

＆＃13;

＆＃13;

＆＃13;

我在我的角项目中使用了引导滑块但是没有正常工作。因为如果我点击任何导航链接回到主页，

然后滑块不会显示在HTML DOM中。

注意：在bootstrap owl carousel item中使用动态数据

  <div id="demo" class="carousel slide" data-ride="carousel">


      <ul class="carousel-indicators">
        <li data-target="#demo" data-slide-to="0" class="active"></li>
        <li data-target="#demo" data-slide-to="1"></li>
        <li data-target="#demo" data-slide-to="2"></li>
      </ul>


      <div class="carousel-inner">
        <div class="carousel-item" *ngFor="let newstreList of trendingNewData;">
            <img [src]="newstreList.trenImage" title="{{newstreList.trenImage}}">
          <div class="carousel-caption">
              <h1>{{newstreList.trenHeading}}</h1>
              <p> {{newstreList.treanDescription}}</p>
            </div>
        </div>


      </div>


      <a class="carousel-control-prev" href="#demo" data-slide="prev">
        <span class="carousel-control-prev-icon"></span>
      </a>
      <a class="carousel-control-next" href="#demo" data-slide="next">
        <span class="carousel-control-next-icon"></span>
      </a>
    </div>