0

在 ionSlideBox 中反应性地添加/删除幻灯片时,我需要一些帮助。我试图获得的功能是这样的:用户可以添加一个或多个“产品”。每个产品条目都是一张幻灯片。添加所有这些幻灯片(产品)后,最终保存数据。因此,首先,ionSlideBox 中只有 1 张幻灯片。用户单击“加号”按钮,又添加了一张幻灯片。

{{#ionView}}
    {{#ionContent}}
      {{#ionSlideBox}}
          {{#each dynamicSlides}}
            {{#ionSlide}}
               <h4>Product #{{count}}</h4>
               {{! form to accept productInfo }}
            {{/ionSlide}}
          {{/each}}
      {{/ionSlideBox}}
    {{/ionContent}}
  {{/ionView}}  

Session.setDefault('slideCounter', 1);

Template.addProductList.helpers({
  dynamicSlides: function() {
    var counter = Session.get('slideCounter');
    TempData.insert({"count": counter, "productInfo": {} });
    return TempData.find();
  }
});

Template.plusButton.events({
  'click button#add-one-more': function() {
    Session.set('slideCounter', Session.get('slideCounter') + 1);
    TempData.insert({"count": Session.get('slideCounter'), "productInfo": {} });
  }
})

但额外的幻灯片不会反应性地添加到 ionSlideBox。该视图仅显示默认值 - “产品 #1”,尽管通过 plusButton 事件添加了更多幻灯片(产品)。我知道这里出了点问题,但我无法弄清楚是什么。任何帮助/指针将不胜感激。

另外,如何在 Meteor 中使用 $ionicSlideBoxDelegate 等效方法?具体来说,离子角度的$ionicSlideBoxDelegate.update() 的流星等价物是什么?

谢谢。

4

1 回答 1

0

Meteoric 正在使用Slick来制作 ionSlideBox。

要响应式添加幻灯片,需要使用 collection.observe 来处理集合更改

Template.yourTemplateName.onCreated(function() {
  yourCollection.find().observe({
    added: function (document) {
      var $slideBox = $('.ion-slide-box');
      var html = "your html here";
      $slideBox.slick('slickAdd',html);
    }
  });
});
于 2015-09-13T09:42:05.177 回答