Meteor 从一个列表页进入详情页怎么快速显示详情

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.服务器的推送

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：

<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 从一个列表页进入详情页怎么快速显示详情

相关推荐