Syl*_*lar 2 jquery meteor meteor-helper
我的应用程序中有一个名为layout的模板.里面有:
<body id="body class="{{blue}}>
基本上我想要实现的是当你点击网址时,例如www.abc.com/sky,我想添加一个蓝色的正文类:
<body id="body class="blue">
在我的客户端文件夹中我有这个,但似乎不起作用:
Template.layout.helpers({
blue: function() {
var loc = window.location.href; // returns the full URL
if(/sky/.test(loc)) {
$('#body').addClass('blue');
}
}
});
我是javascript世界的新手,我正在学习一个教程,但教程并不针对Meteor.
你可以在onRendered中修改DOM元素,如下所示:
Template.layout.onRendered(function() {
// get the current route name (better than checking window.location)
var routeName = Router.current().route.getName();
// add the class to body if this is the correct route
if (routeName === 'myRoute')
$('body').addClass('blue');
});
Template.layout.onDestroyed(function() {
// remove the class to it does not appear on other routes
$('body').removeClass('blue');
});
另一种(也可能更简单)的解决方案就是在body模板上使用帮助器:
Template.body.helpers({
klass: function() {
if (Router.current().route.getName() === 'myRoute') {
return 'blue';
}
}
});
然后你body可能看起来像这样:
<body class="{{klass}}"></body>