Question

我一直在寻找，并且没有真正找到这个看似非常简单的问题的答案。

我的应用程序有默认模板

Router.configure({
layoutTemplate: 'appLayout',
});

<template name="appLayout">
  <div id="container">
    {{> yield}}
  </div>
</template>

然后我有了一条名为＆＃39; reservations＆＃39;

的新路线

Router.route('/reservations',{
name:'reservations',
  onAfterAction: function(){

  }
});

我想要做的是将一个类添加到默认容器中，该容器使用css过渡来将背景颜色从白色变为黑色。

我到目前为止所尝试的是 onAfterAction

Router.route('/reservations',{
name:'reservations',
onAfterAction: function(){
    $('#container').addClass('black');
}
});

什么都不做，没有错误，没有任何东西。所以我试过了

Template.reservations.rendered = function () {
setTimeout(function(){
    $('#container').addClass('black');
});
};

哪个有效，但会闪烁并产生路由问题。您可以在crawfish.meteor.com查看路由问题。如何在呈现模板后简单地切换类？

Answer 1

您可以使用rendered事件：

Template.reservations.rendered = function() {
    if( ! this.rendered) {
        $('#container').addClass('black');
        this.rendered = true;
    }
};

请注意，我们检查并设置渲染。然后，Template实例有一个'rendered'变量，我们用它来防止在重新渲染时重新触发（可以多次运行）

如何在Iron路由器默认模板中添加一个类？

1 个答案: