Javascript 如何在angular js指令中定义owl转盘回调函数?

Javascript 如何在angular js指令中定义owl转盘回调函数?,javascript,jquery,angularjs,owl-carousel,Javascript,Jquery,Angularjs,Owl Carousel,我面临着一个与角js猫头鹰旋转木马的问题。我正在使用带有angular js的owl旋转木马,并为其制作一个指令。但是,当我使用OWLCarousel的回调时,它在控制台中显示该函数未定义 代码如下: 有棱角的 HTML {{challenge.challenge} 牛顿定律 {{挑战。学生计数}学生接受了。 接受 挑战 回调_init显示未定义。这段代码有什么问题?您是否尝试过初始化:函数(事件){…}?它位于html的数据选项中。请检查html的“wrap owlcarousel”部

我面临着一个与角js猫头鹰旋转木马的问题。我正在使用带有angular js的owl旋转木马,并为其制作一个指令。但是,当我使用OWLCarousel的回调时,它在控制台中显示该函数未定义

代码如下:

有棱角的 HTML

{{challenge.challenge}

牛顿定律

{{挑战。学生计数}学生接受了。

接受 挑战

回调_init显示未定义。这段代码有什么问题?

您是否尝试过初始化:函数(事件){…}?它位于html的数据选项中。请检查html的“wrap owlcarousel”部分,我通过angular.element获得它,所以它会工作?如果我使用onInitialized:function(event){…},它会给出语法错误。这是因为我以前在data-options.Got中使用过大括号“{}”。我必须用$scope在控制器中定义它,然后它才能工作。您是否尝试过初始化:function(event){…}?它在html的数据选项中。请检查html的“wrap owlcarousel”部分,我通过angular.element获得它,所以它会工作?如果我使用onInitialized:function(event){…},它会给出语法错误。这是因为我以前在data-options.Got中使用过大括号“{}”。我必须用$scope在控制器中定义它,然后它才能工作。
angular.module('myApp').directive('wrapOwlcarousel', function () {
    var linker = function postLink(scope,element,attr){
      var module = angular.element(element).attr('module');
      var options = angular.element(element).attr('data-options');
      scope.$watch(module, function(){
        if ( scope.challengesData && scope.challengesData.challenges && scope.challengesData.challenges.length > 0 ){
          angular.element(element).owlCarousel(options);
        }
      });
      var callback_init = function(event) {
        console.log('Event is', event);
      }
    }
    return{
      restrict : 'E',
      link: linker
    }
});
<div class="col-md-12 col-sm-12 col-lg-12 col-xs-12 testimonial-wrapper-main-box">
  <wrap-owlcarousel class="owl-carousel" module="challengesData.challenges" data-options="{
          autoPlay: 5000,
          stopOnHover: true,
          onInitialized : callback_init,
          slideSpeed : 300,
          paginationSpeed : 400,
          navigation: true,
          navigationText : ['<i class=\'fa fa-angle-left\'></i>','<i class=\'fa fa-angle-right\'></i>'],
          singleItem : true}">
          <div class="media social-feed row" ng-repeat="challenge in challengesData.challenges">
            <div class="col-md-8 col-sm-8 media-body-wrapper">
              <span class="pull-left testimonial-image">
                <i class="fa fa-trophy testimonial-trophy-icon"></i>
              </span>
              <div class="media-body">
                <p class="challenge-txt">{{challenge.challenge}}</p>
                <p class="challenge-txt-big">Newton's Law</p>
                <p class="challenge-txt">
                  <span class="challenge-count">{{challenge.student_count}}</span> students accepted it.
                </p>
              </div>
            </div>
            <div class="col-md-4 col-sm-4 testimonial-button-wrapper">
              <button class="pull-left testimonial-button">Accept
                challenge</button>
              </div>
            </div>
          </wrap-owlcarousel>
        </div>