Javascript 如何在meteor.js中重置Template.dynamic
我在我的meteor应用程序中有一条路径:slug/profile,当导航到该路径时,会显示一个用户配置文件模板,可以使用一些导航丸进行导航,单击该模板时,会动态加载一个嵌套模板 可单击的_profile.htmlJavascript 如何在meteor.js中重置Template.dynamic,javascript,jquery,html,meteor,meteor-blaze,Javascript,Jquery,Html,Meteor,Meteor Blaze,我在我的meteor应用程序中有一条路径:slug/profile,当导航到该路径时,会显示一个用户配置文件模板,可以使用一些导航丸进行导航,单击该模板时,会动态加载一个嵌套模板 可单击的_profile.html <template name="clickable_profile"> <div id="nav"> <ul class="nav nav-pills"> <li data-template="c
<template name="clickable_profile">
<div id="nav">
<ul class="nav nav-pills">
<li data-template="clickable_picture" role="presentation" class="active" id="details"> <a href="#" >User Details<span class="sr-only">(current)</span></a> </li>
<li data-template="clickable_shared" role="presentation"> <a href="#">Shared Files</a> </li>
<li data-template="clickable_connections" role="presentation" id="connections" > <a href="#">Connections</a> </li>
</ul>
</div>
{{> Template.dynamic template=tab }}
</template>
其中一个嵌套模板有自己的导航丸集
,如下所示
可点击的连接.html
<template name="clickable_connections">
<div id="profile-wrap">
<div id="nav-nested">
<ul class="nav nested-nav-pills">
<li data-template="clickable_followers" role="presentation" class="active" id="clickable_followers"> <a href="#" >Followers<span class="sr-only">(current)</span></a> </li>
<li data-template="clickable_following" role="presentation" id="clickable_following"> <a href="#">Following </a></li>
</ul>
</div>
<div class="row">
{{> Template.dynamic template=tabs }}
</div>
</div>
</template>
其中一个嵌套导航药丸
呈现一个模板,显示用户跟随谁
可单击的\u following.html
<template name="clickable_following">
{{#each whoThisProfilesFollows}}
<div class="col-lg-4 col-sm-4 col-12 main-box-layout">
<div class="box rounded">
<div class="pull-left image">
<img src="{{thisConnectionsProfilePic(username)}}" class="img-circle followavatar" alt="user profile image" id="default" >
</div>
</div>
<div class="box-layout-text text-right">
<span class="details">{{username}}</span><br>
<div class =row id="votes">
<img src="/up.png" class="ranks" id="upvote">
<img src="/down.png" class="ranks" id="downvote">
</div>
<div class="row" id="scores">
<h3 class="count white block">{{profile.upScore}}</h3>
<h3 class="count white block">{{profile.downScore}}</h3>
</div>
</div>
</div>
{{else}}
<p>This User follows nobody yet!</p>
{{/each}}
</template>
当用户单击他们正在查看的配置文件所遵循的其中一个用户的配置文件图片时,将调用click#default
功能。这会将用户定向到单击的用户配置文件。所有新用户数据加载良好,并按预期填充配置文件模板
我的问题是,每次用户访问该路线时,我都要将活动模板和活动
导航丸
重置为其初始值。此时,用户单击配置文件图像时到达的当前嵌套模板保持活动状态,但只是用新用户数据重新填充 用一些jquery修复了它
Template.clickable_following.events({
'click #default': function(event, template) {
let username = this.username
$('#details').click();
Router.go("/"+username+"/profile")
}
})
<template name="clickable_following">
{{#each whoThisProfilesFollows}}
<div class="col-lg-4 col-sm-4 col-12 main-box-layout">
<div class="box rounded">
<div class="pull-left image">
<img src="{{thisConnectionsProfilePic(username)}}" class="img-circle followavatar" alt="user profile image" id="default" >
</div>
</div>
<div class="box-layout-text text-right">
<span class="details">{{username}}</span><br>
<div class =row id="votes">
<img src="/up.png" class="ranks" id="upvote">
<img src="/down.png" class="ranks" id="downvote">
</div>
<div class="row" id="scores">
<h3 class="count white block">{{profile.upScore}}</h3>
<h3 class="count white block">{{profile.downScore}}</h3>
</div>
</div>
</div>
{{else}}
<p>This User follows nobody yet!</p>
{{/each}}
</template>
Template.clickable_following.helpers({
whoThisProfilesFollows: function(){
const following = this.whoProfilesFollows
return Meteor.users.find({username: {$in: following}});
} ,
});
Template.clickable_following.events({
'click #default': function(event, template) {
let username = this.username
console.log(username)
Router.go("/"+username+"/profile")
}
})
Template.registerHelper('thisConnectionsProfilePic', function(username) {
let mup= UserImages.findOne({username:username}).image
return mup
}
)
Template.clickable_following.events({
'click #default': function(event, template) {
let username = this.username
$('#details').click();
Router.go("/"+username+"/profile")
}
})