无法在 Angular 中为 RoyalSlider 加载图像答案

【问题标题】：Unable to load images for RoyalSlider in Angular无法在 Angular 中为 RoyalSlider 加载图像
【发布时间】：2014-12-05 22:01:22
【问题描述】：

Angular 应用会在用户执行如下操作后加载图像：

<div class="royalSlider rsDefault" royalSlider>
  <img class="rsImg" ng-repeat="i in selectedAsset[0].images" ng-src="{{ i }}" />
</div>

在尝试使用RoyalSlider Jquery plugin 时，我使用了一个指令：

app.directive('royalSlider', function() {
    var linker = function (scope, element, attrs) {
        scope.$watch('selectedAsset', function(){
            element.royalSlider({
                keyboardNavEnabled: true,
                autoScaleSlider: true,
                autoHeight: true
            });
        });
    };
    return {
        restrict: 'AEC',
        link: linker
    }
});

问题是当royalslider被实例化时，上面的内容会从DOM中删除图片。

我错过了什么？

【问题讨论】：

调试的时候，是不是element.royalSlider()在selectedAsset实际有值之前被调用？
@greener 我们能解决这个问题吗？？
对于带有一些 ajax 的 any1，stackoverflow.com/questions/23934698/…

标签： jquery angularjs

【解决方案1】：

您没有在您的视图中调用该指令。像这样使用它：

<div class="royalSlider rsDefault" royal-slider>
  <img class="rsImg" ng-repeat="i in selectedAsset[0].images" ng-src="{{ i }}" />
</div>

【讨论】：