javascript - knockout : How to run script after inserting data in observable array

Question

我有一个画廊列表:

 <div class="gallery">
            <a href="#" class="next">next</a>
            <a href="#" class="prev">prev</a>

            <div class="frame">
                <ul data-bind="foreach: designs">
                    <li>
                        <span class="text">№<span data-bind="text: getID()"></span> <span data-bind="text: getName()"></span></span>
                         <img src="images/img01.jpg" width="182" height="102" alt="image description"/>
                    </li>
                </ul>
            </div>

  </div>

JS

Models.Design = function () {...}

function ViewModel(){   
    this.designs = ko.observableArray();


    this.addDesign = function (_id, _name, _image, _video) {

        var design = new Models.Design;

        design.setID(_id);
        design.setName(_name);

        this.designs.push(design);
   };

   this.addDesign(1, "Image 1");
   this.addDesign(2, "Image 1");
   this.addDesign(3, "Image 1");
 // at this moment there is no elements in DOM
}

问题:我需要在哪里编写$('.gallery').galleryScroll();来更新我的图库 slider ？

Answer 1

只需订阅可观察的内容即可。对于集合的任何可见*更改，都会调用您的回调。

function ViewModel() {
    this.designs = ko.observableArray();
    this.designs.subscribe(function () {
        $('.gallery').galleryScroll();
    });

    // ...
}

* 可见意味着您对可观察对象执行操作，而不是直接对底层数组执行操作。