javascript - JQuery owlCarousel plugin is not working with Angular 2 -
as new angular2 expecting find out solution following scenario. jquery plugin not working after getting data -http://www.owlcarousel.owlgraphic.com/
i got issues on
`var owl = jquery(this.elementref.nativeelement).find('#breif'); owl.owlcarousel();`
my full code given bellow
angular 2 component:
/ beautify ignore:start / import {component, oninit , elementref, inject } '@angular/core'; import {form_directives} '@angular/common'; import {carousel_directives} 'ng2-bootstrap/components/carousel'; / beautify ignore:end / import {api} '../../../../services/api'; declare var jquery:any; @component({ selector: 'breif', directives: [carousel_directives], template: require('./template.html') }) export class breifcomponent implements oninit { elementref: elementref; breifs: object; public myinterval:number = 5000; public nowrapslides:boolean = false; public slides:array<any> = []; constructor(@inject(elementref) elementref: elementref , private api: api) { this.elementref = elementref this.loadbreif(); } ngoninit() { **var owl = jquery(this.elementref.nativeelement).find('#breif'); owl.owlcarousel();** } loadbreif(){ this.api.getbreif().subscribe( data => { this.breifs = data.result.articles; }, err => console.error(err), () => { } ) } }
template.html
<-div class="owl-carousel" id="breif"- -> <div class="item" *ngfor="let breif of breifs"><h4>{{breif.title}}</h4></div->
Comments
Post a Comment