Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The jJQuery plugin is not working after getting the data -http://www.owlcarousel.owlgraphic.com/ #65

Open
itranga opened this issue Aug 8, 2016 · 1 comment
Labels

Comments

@itranga
Copy link

itranga commented Aug 8, 2016

The jQuery plugin is not working after getting the data -http://www.owlcarousel.owlgraphic.com/

i got issues on *var owl = jQuery(this.elementRef.nativeElement).find('#breif'); owl.owlCarousel();

My full code are given bellow

angular 2 component:

/ beautify ignore:start /
import {Component, OnInit , ElementRef, Inject } from '@angular/core';
import {FORM_DIRECTIVES} from '@angular/common';
import {CAROUSEL_DIRECTIVES} from 'ng2-bootstrap/components/carousel';
/ beautify ignore:end /
import {Api} from '../../../../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 = [];

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">

{{breif.title}}

--- Want to back this issue? **[Post a bounty on it!](https://www.bountysource.com/issues/36735854-the-jjquery-plugin-is-not-working-after-getting-the-data-http-www-owlcarousel-owlgraphic-com?utm_campaign=plugin&utm_content=tracker%2F32095848&utm_medium=issues&utm_source=github)** We accept bounties via [Bountysource](https://www.bountysource.com/?utm_campaign=plugin&utm_content=tracker%2F32095848&utm_medium=issues&utm_source=github).
@cmelion
Copy link
Owner

cmelion commented Aug 9, 2016

Have you considered a lighter-weight solution? A pure CSS makes for a great cross-framework alternative.

http://cssslider.com/wordpress-slideshow-32.html

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants