【问题标题】:meteor iron router dynamic segment not working陨铁路由器动态段不工作
【发布时间】:2013-12-24 09:06:37
【问题描述】:

我一直在研究流星,它太棒了!我一直在寻找路由解决方案,我发现'iron-router' 很酷,我设法让获取静态页面与模板一起使用,但是当我转到 /posts/123 时,页面没有呈现。我一直在关注这个网站上的视频

https://www.eventedmind.com/feed/q8QWX5e7PTu8BEReY

这是我的代码

blog.js 已编辑

Posts = new Meteor.Collection('posts');

Router.configure({
  layout: 'layout',
  loadingTemplate: 'loading',
  notFoundtemplate: 'notFound'
});

Router.map( function (){
  this.route('posts', {
    path: '/',
    waitOn: function () {
      return App.subs.posts;
    },
    data: {
      posts: function () {
        return Posts.find({}, {sort: {order: 1}});
      }
    }
  });

  this.route('postShow', {
    path: '/posts/:_id'
  });
});

if (Meteor.isServer) {
  Meteor.publish('posts', function () {
    return Posts.find({}, {sort: {order: 1}});
  });

  Meteor.publish('post', function (id) {
    return Posts.find({_id: id});
  });
}

if (Meteor.isClient) {
  App = {
    subs: {
      posts: Meteor.subscribe('posts')
    }
  };

  PostShowController = RouteController.extend({
    template: 'postShow',
    before: function () {
      var _id = this.params._id;

      if(App.subs.post)
        App.subs.post.stop();

      App.subs.post = Meteor.subscribe('post', _id);
    },
    data: {
      body: function () {
        return Posts.findOne({_id: this.params._id});
      }
    },
    run: function () {
      this.render('postShow');
    }
  });
}

blog.html

<head>
    <title>IronRouter</title>
</head>

<body>
</body>

<template name="layout">
    <div class="container">
        <aside class="sidebar">
            <div class="sidebar-inner">
                {{yield 'sidebar'}}
            </div>
        </aside>

        <section class="content">
            <div class="content-inner">
                {{yield}}
            </div>
        </section>
    </div>
</template>

<template name="notFound">
  <h1>Not Found</h1>
</template>

<template name="loading">
  <h1>Loading...</h1>
</template>

<template name="posts">
  <h1>Posts</h1>
  <ul>
    {{#each posts}}
    <li>{{> postListItem}}</li>
    {{/each}}
  </ul>
</template>

<template name="postListItem">
    <a href="{{pathFor 'postShow'}}">
        {{title}}
    </a>
</template>

<template name="postShow">
  <p>
    {{body}}
  </p>
</template>

<template name="postShowSidebar">
  <h1>{{title}}</h1>
</template>

【问题讨论】:

  • 在您的控制器中,您的上下文由“数据”定义,并且您正在使用 Posts,但您正在使用 App.subs.post 调用“waitOn”。这可能意味着 Posts.findOne({_id: this.params._id}) 在您的页面呈现时返回空
  • 嗨彼得罗夫,我已经尝试从控制器中删除“waitOn”,但我仍然没有得到任何回复:/
  • 我假设 blog.js 末尾多余的 ` 实际上不在您的代码中,对吧?
  • 不(我只是检查了一下),如果一直都是这个问题,那就太傻了哈哈

标签: javascript meteor segment iron-router


【解决方案1】:

尝试将您的 PostShowController 添加到相应的路由:

this.route('postShow', {
  path: '/posts/:_id',
  controller: 'PostShowController'
});

【讨论】:

  • 这不是必需的 - 来自文档:“当路由运行时,它会寻找一个名为“PostShowController”的全局对象
  • 是的,根据文档,您是正确的 Petrov。感谢您指出。
【解决方案2】:

也许我错过了什么,但在你的控制器中你说

data: function () {
  return Posts.findOne({_id: this.params._id});
},

但在您的模板中,您使用的是 {{body}},我看不到任何地方都为其分配了任何东西。是不是应该这样:

data: {
  body: function () {
    return Posts.findOne({_id: this.params._id});
  }
}

【讨论】:

  • 嗨克里斯蒂安,我刚试过,但不幸的是,它没有用,我假设 {{body}} 是从选定的“帖子”中检索到的(所以在每个“帖子”中都有是“标题”和“正文”),但我可能错了,因为视频中没有指定架构。
  • 我已经在我的机器上设置了你的代码,并注意到数据函数永远不会执行。不知道为什么,但我想我会提到它以防万一。但 run 函数会执行。
  • 感谢克里斯蒂安!感谢您的努力,我将仔细研究数据功能,希望我能尽快让它工作!
【解决方案3】:

我是视频的作者,它可能有点过时了。我很抱歉。我会做以下事情:

  1. layout: 'layout' 更改为layoutTemplate: 'layout'
  2. 从控制器中删除run 方法。该方法实际上做了很多,所以如果你想覆盖渲染,你可以使用action 方法。但就您而言,您无需执行任何操作,因为它会自动发生。
  3. 这有点不相关,但您不需要自己停止订阅。事实证明,Meteor 和 Iron-router 会在计算停止时自动执行此操作(即当您导航到新路线时)。

我希望这会有所帮助!

【讨论】:

  • 感谢克里斯的回复!我设法让它工作!但我注意到'this.params._id'在'data'方法中不可用,但它在'before'方法中工作,所以我在控制器外部创建了一个变量,在'before'中分配它并检索它在“数据”中
  • 太棒了!这很奇怪 this.params 在 data 函数中不可用。那将是您可以在 Github 上提交的合法错误。我也会做个笔记看看。干杯。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2014-10-14
  • 1970-01-01
  • 2014-12-24
  • 1970-01-01
  • 2014-12-14
  • 1970-01-01
  • 2014-09-22
相关资源
最近更新 更多