您的位置:首页 > 其它

Meteor 从一个列表页进入详情页如何快速显示详情

2015-06-05 09:38 260 查看
不管是做android开发,还是做网页web开发,都 会有列表,都需要点击列表进入列表项的详情页面,查看详细信息,能常情况下,我们都是将这一列表项的id传到详情页,由详情页再到数据库查询详细信息。

在用Meteor开发网站中,除了用传id的方法,外还提供了一种简单的方法,极大的方便了我们的开发,节省时间。

原文:/article/9867475.html

1. 创建详情页的route 并传数据:

(1)如可按传id的方法,则这样:

this.route('detail', {
path: '/detail/:app_id',
data: function() {
return {app_id: this.params.app_id};//将id传入到详情页面
}

});

(2)使用新方法(我将之叫做:传对象的方法)我写在后面的步骤都是按之来继续的:

this.route('detail', {
path: '/detail/:_id',
onBeforeAction: function() {
Meteor.subscribe("detailInId",this.params._id);//定阅 :定阅单条信息
this.next();
},
data: function() {
return appdocs.findOne({_id:this.params._id});//为详情页提供对象
//此处一定要用 findOne() 而不能用find()(它得到的是一个cursor对象) 如何一定要用则就是find({_id:_id}).fetch()[0] ,因为页面用的是这个详情的对象,而不是cursor对象
}

});


2.服务器的推送

Meteor.publish("detailInId", function (_id) {
return appdocs.find({_id:_id});//此处要用find()页不能用findOne() 因为publish提应该提供cursor 或 数组。
});


3.详情页,点页列表页的链接<ahref="detail/{{_id}}">点击查看</a>
进入详情后,可以直接使用详情对象来显示内容了.例如

appdocs表中有name  和 url 这两个字段 ,则使用{{url}} {{name}}
就能显示内容,原因是在第一步的data中:return appdocs.findOne({_id:this.params._id}),meteor将它(为了理解,假设这个对象取名为:app)传入了template detail中,
因此我们在调用{{name}}时就是调用了{{app.name}}

html:

<template name="detail">

<div class="form-group">
<label class="col-sm-2 control-label">下载地址:</label>
<div class="col-sm-10">
<p class="form-control-static">{{url}}</p>
</div>
</div>

<div class="form-group">
<label class="col-sm-2 control-label">应用名称:</label>
<div class="col-sm-10">
<p class="form-control-static">{{name}}</p>
</div>
</div>


</template>

4. 简单给出列表页 html

<template name="applist">

<table class="table table-striped  table-hover">
<thead>
<tr>
<td >操作
</td>
</tr>
</thead>

<tbody>
{{#each apps}}
{{> appitem}}
{{/each}}
</tbody>
</table>

</template>

<template name="appitem">

<tr >
<td ><a href="detail/{{_id}}">点击查看</a></td>
</tr>

</template>


原文:/article/9867475.html
参考:https://github.com/iron-meteor/iron-router/blob/master/Guide.md
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: