如何在流星中呈現不同模板時刪除類別

我正在使用流星的網站上工作。在其中一頁上，我希望頂部的一些圖像和div在頁面上動畫。我已經加入實現了這個：如何在流星中呈現不同模板時刪除類別

Template.home.rendered=function(){ 
    $('.animateblock').addClass('animated'); 
};

增加的類改變一些CSS屬性，給我想要的效果。

我遇到的問題是，如果我轉到網站的其他頁面，然後用動畫重新訪問該頁面，則不會重置。該課程只添加過一次，並且我無法找到一種方法在訪問另一個頁面時將其刪除。

我的HTML代碼如下：

<div class="textAnimate animateblock"> 
    <img src="/home/100.png" class="animateblock percent100" alt="100%"> 
    <img src="/home/antibiotics.png" class="animateblock antibiotic" alt="Antibiotic Free"> 
    <img src="/home/natural.png" class="animateblock natural" alt="All Natural"> 
    <div class="horomoneAnimateContainer"> 
    <div class="animateblock horomoneAnimate"> 
    <img src="/home/horomone.png" class="horomone" alt="Horomone Free"> 
    </div> 
    </div> 
</div> 
<div class="stampAnimate animateblock"> 
    <img src="/home/tasty-stamp.png" class="tasty" alt="Tasty Certified"> 
</div>

我已經嘗試了一些不同的方法，如添加addClass前removeClass，希望這將修復它，但事實並非如此。

Template.home.rendered=function(){ 
    $('.animateblock').removeClass('animated'); 
    $('.animateblock').addClass('animated'); 
};

我也嘗試創建像這樣一個Template.destroyed部分，但沒有工作，要麼：

Template.home.destroyed=function(){ 
    $('.animateblock').removeClass('animated'); 
};

我使用流星1.2.0.1和也是用鐵路由器，但一直未能找到解決方案來添加和刪除類。任何建議表示讚賞！

來源

2016-11-18 Kristen Vogler

請參閱http://stackoverflow.com/a/32812777/2805154用於在i-r'onAfterAction中操縱DOM –

我做這樣的事情在jQuery的調用模板負荷：

Template.Messages.onCreated(function() { 
    var self = this; 
    self.autorun(function() { 
    self.subscribe('messageDB', function() { 
     $('.loader').delay(300).fadeOut('slow', function() { 
     $('.transition-wrapper').delay(200).fadeIn('slow'); 
     }); 
    }); 
    }); 
});

流星廚師對裝載模式here一個很好的資源。

來源

2016-11-18 23:46:09

如何在流星中呈現不同模板時刪除類別

回答

相關問題