Question

我目前正在开发一款需要连接Venobox jQuery插件和AngularJs＆＃39; Ng-Repeat迭代数组。

Plunker供参考http://plnkr.co/edit/YJHMhdosWyupc4Wus8Zh?p=preview

当前指令如下。

app.directive("venobox", function() {
    return {
        restrict: 'E',
        transclude: false,
        link: function (scope) {
            scope.initVenobox = function(element) {
                var defaultOptions = {
                    framewidth: '400px',        // default: ''
                    frameheight: '300px',       // default: ''
                    border: '10px',             // default: '0'
                    bgcolor: '#5dff5e',         // default: '#fff'
                    titleattr: 'data-title',    // default: 'title'
                    numeratio: true,            // default: false
                    infinigall: true            // default: false
                };
                var customOptions = scope.$eval($(element).attr('data-options'));
                for(var key in customOptions) {
                    defaultOptions[key] = customOptions[key];
                }
                $(element).venobox(defaultOptions);
            }
        }
    };
});


app.directive('venoboxItem', [function() {
    return {
        restrict: 'A',
        transclude: false,
        link: function(scope, element) {
          // wait for the last item in the ng-repeat then call init
            if(scope.$last) {
                scope.initVenobox(element.parent());
            }
        }
    };
}]);

在app中，它被称为;

<data-venobox venobox-item="">
  <div ng-repeat="item in items" venobox-item="" class="item">
    <a class="venobox" title="{{ item.title }}" data-type="vimeo" ng-href="{{ item.video.url }}">
      <img ng-src="{{ item.thumbnail.img_url }}">
    </a>
  </div
</data-venobox>

该指令在更新数组的静态位时按预期工作，如项[0]。无论如何，但当我在锚点之外包含任何ng语句时，我会在单击该框时收到GET http://my.site.url/undefined 404。当使用ng-repeat时，Venobox指定的点击事件将应用于模态容器而不是锚点。

非常感谢任何有关调试代码的帮助或更好的解决方案。

带有Venobox模态解的角度指令

0 个答案: