Angular-加载数据时Owl Slider无法正常工作

时间:2019-03-08 17:50:17

标签: angular slider components gallery owl-carousel

当我为图库放置静态数据时,一切正常。这是代码:

TS:

export class ObservacoesComponent implements OnInit {

constructor() { }

mySlideTexts = ["DATA1", "DATA2", "DATA3", "DATA4", "DATA5"];
mySlideOptionsText = { items: 3, dots: false, nav: false };

ngOnInit() {}

}

HTML:

<owl-carousel [options]="mySlideOptionsText" [items]="texts" [carouselClasses]="['owl-theme', 'sliding']">
    <div class="item mx-2" *ngFor="let text of mySlideTexts;let i = index">
        <p style="padding:10px; margin: 5px;">{{text}}</p>
        <p>18/06/2018</p>
    </div>
</owl-carousel>  

enter image description here

但是,当我尝试加载真实数据时,会发生以下情况:

enter image description here

画廊不再是画廊。这些项目现在遵循垂直方向,并且没有像以前那样滚动。这是新的.ts代码:

export class ObservacoesComponent implements OnInit {

    token : any;
    woundId : any;
    wound : Wound;
    interventions : Array<Intervention>;

    constructor(private route: ActivatedRoute, private chartsReportService : ChartsReportService ) {  

        this.woundId = this.route.snapshot.paramMap.get('woundId');       
        this.token = this.route.snapshot.paramMap.get('token');

    }

    mySlideTexts = [];
    mySlideOptionsTextTratamentos = {};

    ngOnInit() {
        this.woundId = this.route.snapshot.paramMap.get('woundId');       
        this.token =this.route.snapshot.paramMap.get('token');
        this.getWoundById() 
    }

    getWoundById() {    
    this.chartsReportService.getWoundById(this.woundId, this.token).subscribe((v) => {
    this.wound = v.result;
    this.interventions = v.result.intervention;

    //ver como fica esta informação
    for(let interv of this.interventions)
    {
        this.mySlideTexts.push(interv.observations);
    }
    });

  }
}

您知道问题可能在哪里吗?谢谢。

0 个答案:

没有答案