Question

我做了一些href，它引用了标题中页面的特定部分。我正在使用把手，而href在标题模板中，而目标位于另一个模板中，这里是我的代码片段：

header.html中的

：

<li><a href="#PLATEAU"> PLATEAU </a> </li>

shop_page.html中的

：

<h2> <span id="PLATEAU">PLATEAU</span></h2>

预期结果：当我点击标题中的超链接时，我希望使用目标ID进行跨度。

实际结果：我看到我的路径变为#PLATEAU，但我没有跳到页面的正确部分。

其他信息：使用铁路由器，bootstrap-3包。铬。 macbook pro。流星版0.7.1.2

任何帮助表示赞赏！

干杯

Answer 1

如Iron Router docs中所述，查询字符串和哈希不用于路由。如果您需要路由，则可以使用actualPath/plateau代替actualPath#Plateau，并使用铁路由器呈现您的新内容。

但如果你想在这里使用de hashs，你可以做些什么。我为标签系统做了这个。

Handlebars.registerHelper('currentTab',function(page){
    return Session.get('activeTab') == page;
});

在HTML中：

{{#if currentTab 'PLATEAU'}}
    {{> PLATEAU}}
{{/if}}

<template name="PLATEAU">
<h2> <span id="PLATEAU">PLATEAU</span></h2>
</template>

再次在你的js中

Template.yourTemplate.events({
    'click .tabChange': function(e, t) {
        Session.set('activeTab', window.location.hash);
    }
});

我不再使用它，所以这是一个未经测试的代码。 This answer也许可以帮到你。强烈建议您使用path/:activeTab来获得更好的代码。

Answer 2

假设shop-page.html被称为＆＃39; shop-page＆＃39;在router.js文件中，您可以执行以下操作：

# Create link to anchor
<li><a href="{{pathFor 'shop-page' hash='plateau'}}">PLATEAU</a></li>

# Set anchor
<h2><span id="plateau">PLATEAU</span></h2>

Answer 3

我也经历过这个。默认情况下链接不在Metoer中工作（我在某处看到它与火焰有关），＃linking虽然应该可以工作，但链接到新页面需要路由

Answer 4

这是在Meteor 1.2.1（使用铁路由器1.0.12）上测试的 - 也应该适用于更高版本（旧版本可能需要在提供的代码中进行一两次更改） < / p>

首先，最好将标记更改为

<li><a href="{{pathFor route='yourRouteName' hash='PLATEAU'}}">PLATEAU</a></li>

现在..你需要一个针对这个持久性issue的解决方法，这是我使用的方法：

Router.onAfterAction(function() {
  var hash = this.getParams().hash;
  Tracker.afterFlush(function() {
    if (hash && $("#"+hash).length) {
      // go to element
      Tracker.nonreactive(function() {
        window.location.hash = "";
        window.location.hash = "#"+hash;
      });
    }
  });
});

// go to element之后的部分还有其他一些想法：

  var scrollTop = $("#" + self.params.hash).offset().top;
  $("html,body").scrollTop(scrollTop);

或（有动画）：

  var scrollTop = $("#" + self.params.hash).offset().top;
  $("html,body").animate({
    scrollTop: scrollTop
  });
}

引用（github上的相关铁路由器问题）：

Issue 248 - Issue 373 - Issue 1017 - Issue 1171

href到meteor.js中不在同一页面上的不同部分

4 个答案: