函数调用由指令创建的对象

时间:2015-02-08 11:50:39

标签: javascript angularjs

我有以下情况:

让我的主视图包含页眉,页脚和ng-view以根据控制器加载视图(根据路径选择的控制器)。

<header></header>
<div ng-view="" class="fill"></div>
<footer>
  <span ng-click="nextSlide(swiper)">Next Slide</span>
</footer>

在控制器中,我有一个带有指令的视图,创建一个滑块并返回滑块对象:

    angular.module('App').directive('npSwiper', [
  '$timeout',
  function($timeout) {
    return {
      restrict: 'A',
      link: function(scope, element, attrs) {
        $timeout(function() {
          // This code will run after template has been loaded
          // and transformed by directives
          $timeout(function() {
            // and properly rendered by the browser
            $timeout(function() {
              $timeout(function() {
                var params = {
                  slideElement: 'article',
                  mode: 'horizontal',
                  calculateHeight: true,
                  paginationClickable: true,
                  pagination: '.pagination',
                  resizeReInit: true
                };
                if (attrs.npSwiper === 'gallery') {
                  params.slidesPerView = 1;
                  params.createPagination = false;
                  params.loop = true;
                }
                scope.swiper = new Swiper('.swiper-container', params);
                console.log('directive', scope.swiper);

                new Swiper('.swiper-container-instagram', {
                  slideElement: 'article',
                  mode: 'horizontal',
                  calculateHeight: false,
                  paginationClickable: true,
                  pagination: '.pagination-instagram',
                  resizeReInit: true
                });

              });
            });
          });
        });
      }
    };
  }
]);

我可以创建一个函数

$scope.nextSlide = function(slider) {
  slider.swipeNext();
}

分配给ng-click到一个范围,例如在从控制器加载的同一个视图中,但是当我想将它分配给页脚时(在滑块视图外)它没有结果。

也可以通过以下方式从控制器调用滑块:

$scope.swiper

给出undefined。任何想法如何达到它?

0 个答案:

没有答案