angular 目录平滑执行

Question

我正在使用以下插件：http://vasyabigi.github.io/angular-slick/

我也在使用 ng-repeat，所以我发现它在 ng-repeat 完成之前正在执行。

有什么办法可以解决这个问题吗？

<slick><div ng-repeat="carfactory in vm.carfactory">
        <h4> {{ carfactory.name }}</h4>
        <p>
            <img src="/biler/1.png" style="float: left; padding: 15px; max-width: 100px; height: auto; margin-bottom: 26px;">
        </p>

        <p><b>Pris:</b> {{ carfactory.price | currency }} kroner</p>
        <p><b>Eier:</b> <a href="/">{{ carfactory.ownerid }}</a></p>

        <p>
            <b>Beskyttelse:</b> {{ carfactory.protection }}</p><p><b>Antall igjen:</b> <span id="antall_1">{{ carfactory.amount }}</span>
        </p>

        <p class="hotel-out">
            <input ng-show="carfactory.amount > 0" class="btn btn-block" ng-click="vm.purchasecar(carfactory)" type="submit"value="Kjøp bil!">
            <p class="hotel-in alert alert-warning" ng-show="carfactory.amount <= 0">Gå ut av hotell for å kjøpe en bil.</p>
        </p>
</div></slick>

这行不通，但如果我删除转发器并复制+粘贴代码两次，它就可以工作。

知道如何使 ng-repeat 工作，或者我如何让 slicker 插件等待它完成加载吗？

编辑：

如果我执行 <slick init-onload="true" data="vm.carfactory" 然后我得到以下错误：

slider.unslick is not a function

编辑：我的控制器正在使用 angular.module('garage',['slick'])

Answer 1

我的假设是在呈现 ng-repeat 中的项目之前调用 slick。当 ng-repeat 完成渲染时，您可以尝试（重新）执行 slick() 函数，使用以下代码示例：

<div ng-repeat="carfactory in vm.carfactory" ng-init="$last && reloadSlick()">

$last 变量确保仅针对最后一项（一次）调用该函数。

作为安全措施，您可以使用 setTimeout() 将代码包装在 reloadSlick() 中，以便其执行等待下一个事件循环。

$scope.reloadSlick = function() {
  setTimeout(function() {... code here ...})
}

更多关于ng-repeat渲染回调的参考资料：

Calling a function when ng-repeat has finished
ng-repeat finish event

angular 目录平滑执行

angular directory slick execution

javascript

angularjs

mean-stack