Meteor 从一个列表页进入详情页怎样高速显示详情
无论是做android开发,还是做网页web开发,都 会有列表,都须要点击列表进入列表项的详情页面,查看具体信息,能常情况下,我们都是将这一列表项的id传到详情页,由详情页再到数据库查询具体信息。
在用Meteor开发站点中。除了用传id的方法。外还提供了一种简单的方法,极大的方便了我们的开发,节省时间。
原文:http://blog.csdn.net/casun_li/article/details/46371811
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.server的推送
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>原文:http://blog.csdn.net/casun_li/article/details/46371811
參考:https://github.com/iron-meteor/iron-router/blob/master/Guide.md
Meteor 从一个列表页进入详情页怎样高速显示详情的更多相关文章
- django-用户浏览记录添加及商品详情页
视图函数views.py # /goods/商品id class DetailView(View): '''详情页''' def get(self, request, goods_id): '''显示 ...
- Django----使用模板系统渲染博客页面、实现列表和详情页的跳转、前后跳转功能
.模板写法同Flask,可以参考之前的FLask-模板 .将之前的BootStrap静态页面中的数据使用模板写 <!DOCTYPE html> <html lang="en ...
- 如何用Baas快速在腾讯云上开发小程序-系列4:实现客户侧商品列表、商品详情页程序
版权声明:本文由贺嘉 原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/431172001487671163 来源:腾云阁 h ...
- [django]详情页列表页
详情页列表页 列表页展示titile--这个模型的部分字段 详情页展示这个模型的所有字段 我想看下related_name这个从主表取子表数据 取数据--官网投票例子 https://docs.dja ...
- vue项目实现列表页-详情页返回不刷新,再点其他菜单项返回刷新的需求
问题背景:有时候一些列表会有一些跳转的需求,比如跳到详情页.或者是其他相关的页面(比如跳到用户列表去查看用户的相关信息)等,此时再返回列表页,列表页会刷新重置.目前需求就是需要改成如下情况: 问题1. ...
- mxonline实战13,授课讲师列表页,详情页,index页面全局导航
对应github地址:第13天 把teacher-list.html和teacher-detail.html拷贝过来 一. 授课讲师列表页 1. 修改html文件 把org-list.ht ...
- mxonline实战10,课程列表页,课程详情页1
对应github地址:第10天 一. 课程列表页 1. 拷贝course-list.html到templates目录中 2. 编写url和view 在courses/views.py中新加
- mui列表跳转到详情页优化方案
原理 因为列表页到详情页是多对一的形式,即列表页的多条数据列表对应的是一个详情页,只是数据不同而:因此,可以在加载列表页时预加载详情页,即创建一个详情页的webview,但是不显示出来,点击列表的时候 ...
- react 从商品详情页返回到商品列表页,列表自动滚动上次浏览的位置
现状:目前从商品详情页返回到商品列表页,还需要再去请求服务数据,还需要用户再去等待获取数据的过程,这样用户体验非常不好, 遇到的问题: 1:如何将数据缓存, 2:如何获取和保存列表滑动的高度, 3:判 ...
随机推荐
- 【git】不检查特定文件的更改情况
.gitignore只能忽略那些原来没有被track的文件,如果某些文件已经被纳入了版本管理中,则修改.gitignore是无效的.正确的做法是在每个clone下来的仓库中手动设置不要检查特定文件的更 ...
- 解决 mounting /dev/block/mmcblk0p1 on /sdcard failed
http://www.liyu8.com/article/sdcard.htm 之前在recovery下的adb shell执行mount -a总是会有 mount: mouting /dev/blo ...
- ubuntu14.04安装搜狗拼音以及Google-chrome
安装搜狗拼音 1.进入https://pinyin.sogou.com/linux/选择合适版本下载: 2.直接打开deb包进行安装: 3.安装完成后,打开系统设置中语言支持选项,在键盘输入方式系统中 ...
- 【MySQL】可重复读模式下 unique key失效案例
一 [背景] 今天上午文能提笔安天下,武能上马定乾坤的登博给团队出了一道题目,谁先复现问题,奖励星巴克一杯.激起了一群忙碌的屌丝DBA的极大热情.问题是这样滴,如下图登博提示了几个细节: 1. ...
- 常见slave 延迟原因以及解决方法
一 序言在运维线上M-M 架构的MySQL数据库时,接收的比较多关于主备延时的报警: 点击(此处)折叠或打开 check_ins_slave_lag (err_cnt:1)critical-slav ...
- CentOS 7.0:搭建SVN服务器
1. 通过 yum install subversion来安装 2. 提示已经安装.查看svn版本 第二步: 创建svn版本库 第三步: 配置svn信息 2. 配置权限配置文件authz 3. 配置用 ...
- final,buaa_oo conclusion
UML系列作业设计架构 第13次作业 本单元的第一次作业中,涉及到了类图的解析.在着手做这单元作业的时候,需要将每一种 UmlElement 再封装,并在解析时,用 helper 单例来进行查询处理( ...
- 四、harbor实践之初识harbor
1 什么是Harbor harbor是VMware公司开源的企业级Registry项目,其的目标是帮助用户迅速搭建一个企业级的Docker registry 服务. 2 什么是Registry Reg ...
- Leetcode 331.验证二叉树的前序序列化
验证二叉树的前序序列化 序列化二叉树的一种方法是使用前序遍历.当我们遇到一个非空节点时,我们可以记录下这个节点的值.如果它是一个空节点,我们可以使用一个标记值记录,例如#. 例如,上面的二叉树可以被序 ...
- 九度oj 1011
题目描述: 给定K个整数的序列{ N1, N2, ..., NK },其任意连续子序列可表示为{ Ni, Ni+1, ..., Nj },其中 1 <= i <= j <= ...