Question

我正在尝试将一个类添加到DOM元素中，该DOM元素是我所有DOM树的父元素。我尝试了不同的方法：

//this one doesn't work at all. DOM is not loaded
Template.home.created = function() {
    Meteor.startup(function() {
        $("#wrapper").addClass('app');
   });
}

//this one only works if you do a page load, not if you render the template through a link (using router)
Template.home.created = function() {
    Meteor.startup(function() {
        $(document).ready(function() {
            $("#wrapper").addClass('app');
        });
   });
}

//also does not work if I click on a link
Template.home.created = function() {
    $(document).ready(function() {
        $("#wrapper").addClass('app');
   });
}

//does not work at all (I really expected this one to work by clicking on a link (using router))
Template.home.created = function() {
    $("#wrapper").addClass('app');
   });
}

我正在尝试做的事情不是更简单：添加一个类，这样我就可以根据每个模板设置我的包装器样式。任何关于如何做到这一点的建议将不胜感激。

Answer 1

模板创建方法在初始化模板实例时调用，但不等待DOM准备好进行操作。

使用模板渲染方法，当模板呈现DOM时会调用该方法（一次首次加载，每次标记在模板中更改）

这样的事情应该有效（未经测试）：

Template.home.rendered = function(){
    var element = $("#wrapper");
    if(!element.hasClass("app")){
        element.addClass("app"); 
    }
}

Answer 2

尝试使用Template.home.rendered代替Template.home.created。不要在其中使用Meteor.startup或$(document).ready。

http://docs.meteor.com/#template_rendered

创建模板对象时会调用

Template.home.created，但此时没有任何内容被渲染到dom节点中。

Meteor - 在模板加载时将类添加到DOM元素

2 个答案: