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:判 ...
随机推荐
- Python 基本数据类型 (二) - 字符串
str.expandtabs([tabsize]): str类型的expandtabs函数,有一个可选参数tabsize(制表符大小) 详细来说,expandtabs的意思就是,将字符串中的制表符\t ...
- HDU 6447
YJJ's Salesman Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others)To ...
- Spring核心技术(十二)——基于Java的容器配置(二)
使用@Configuration注解 @Configuration注解是一个类级别的注解,表明该对象是用来指定Bean的定义的.@Configuration注解的类通过@Bean注解的方法来声明Bea ...
- 如何完整反编译AndroidMainfest.xml
下载工具: http://code.google.com/p/android4me/downloads/detail?name=AXMLPrinter.zip&can=2&q= 包名为 ...
- 用Go编写的本地文件服务器
本文来自网易云社区,转载务必请注明出处. 一.前言 一切问题的起源就是来自一个问题"为什么我打的jar包没有注解?",带着这个疑问查了一圈资料,原来问题主要是在没有将源码中的注释进 ...
- PHP cannoy modify header information - headers already sent by ....
我采用的是MVC模式的写法,代码和html分离的写法 <?php require '../mysql_connect.php'; require('../model/functions.php' ...
- 【LeetCode】Valid Parentheses(有效的括号)
这道题是LeetCode里的第20道题. 题目要求: 给定一个只包括 '(',')','{','}','[',']' 的字符串,判断字符串是否有效. 有效字符串需满足: 左括号必须用相同类型的右括号闭 ...
- TOJ 1203: Number Sequence
1203: Number Sequence Time Limit(Common/Java):1000MS/10000MS Memory Limit:65536KByte Total Submi ...
- android项目引入第三方库工程出现的问题及解决方案
一.导入libar库工程 1.使用第三方库工程libary,基本上都是从github上下载,解压后里面有个libary文件夹 2.将libary导入到eclipse中,步骤如下 1)在eclipse包 ...
- ASP.NET(五):ASP.net实现真分页显示数据
导读:在上篇文章中,介绍了用假分页实现数据的分页显示 ,而避免了去拖动滚动条.但,假分页在分页的同时,其实是拖垮了查询效率的.每一次分页都得重新查询一遍数据,那么有没有方法可以同时兼顾效率和分页呢,那 ...