Question

我根据我的API提供的js对象创建一个绑定处理程序来处理轮播。出于测试目的，我将静态加载内容。

我有以下对象：

self.images = [
    { 
      imageUrl: 'http://www.triptips.com.br/site/wp-content/uploads/2013/11/castillo-praga.jpg', 
      description: 'Photo from Praga.' 
    },
    { 
      imageUrl: 'http://www.4yourevista.com.br/wp-content/uploads/2014/06/berlim-01-4you.jpg', 
      description: 'Photo from Berlim.' },
    { 
      imageUrl: 'http://cdni.wired.co.uk/1920x1280/k_n/London_5.jpg', 
      description: 'Photo from London.' },
    { 
      imageUrl: 'http://www.dudalinafeminina.com.br/blog/wp-content/uploads/2013/08/paris2.jpg', 
      description: 'Photo from Paris.' },
    { 
      imageUrl: 'http://upload.wikimedia.org/wikipedia/commons/e/e1/1_hongkong_panorama_victoria_peak_2011.JPG', 
      description: 'Photo from Hong Kong.' }
];

好吧，一旦imageUrl从其他地方加载，它就需要一些时间才能完全加载。

我正在创建此处理程序：

ko.bindingHandlers.carousel = {
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        $(element).slick({ ... }); // this is the slider component
    },
    update: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
    }
}

使用静态内容（例如某些文本），它可以正常工作。但是，当我尝试将此绑定与foreach迭代一起使用时，它不起作用。

<div class="centered" data-bind="carousel: {}, foreach: images">
    <div>
        <img alt="" data-bind="attr: { src: imageUrl, title: description }" />
    </div>
</div>

感谢您的帮助！

Answer 1

绑定按其找到的顺序进行解释。

在这里，您可能希望在foreach绑定之前执行carousel绑定，因此请尝试反转它们：

<div class="centered" data-bind="foreach: images, carousel: {}">

如何通知绑定处理程序内容已满载？

1 个答案: