Angular2 router.navigate刷新页面

Angular2 router.navigate刷新页面,angular,angular2-routing,Angular,Angular2 Routing,这是管线和组件的外观: routes.config 新用户组件 Angular2是否应该刷新路由器上的页面。导航? 还可以使用什么来代替路由器的。导航以避免任何页面刷新 这是证据: 您可能正在调用路由器。在单击事件中导航函数 <button class="btn btn-default" (click)="save()">Save</button> 这适用于IE11和边缘浏览器,但会在Chrome中重新加载应用程序 这是因为按钮元素中缺少类型,如果按钮位于中,C

这是管线和组件的外观:

routes.config

新用户组件

Angular2是否应该刷新路由器上的页面。导航?

还可以使用什么来代替路由器的。导航以避免任何页面刷新

这是证据:
您可能正在调用
路由器。在单击事件中导航
函数

<button class="btn btn-default"
    (click)="save()">Save</button>
这适用于IE11和边缘浏览器,但会在Chrome中重新加载应用程序

这是因为按钮元素中缺少
类型
,如果按钮位于
中,Chrome将使用“提交”作为默认值。单击按钮时导致表单提交

使用
按钮
元素时,最好始终设置
类型

因此,将HTML更改为

<button class="btn btn-default" type="button"
        (click)="save()">Save</button>
保存
将使它在所有3个浏览器上都能工作

我以前的解决方案也有效,(返回false将阻止默认操作,也就是提交表单),但我认为上面的解决方案更可取

过时的答案,但留给后代:

<button class="btn btn-default"
        (click)="save(); false">Save</button>
保存
我使用了一个简单的
链接,获得了同样的效果(导航到详细信息页面时页面刷新)。 解决方案是使用角度链接:
For me works nice(来自组件代码):


它会自动将页面重新加载到给定的url部分。

这涵盖了AngularJS/Angular混合情况。我之所以添加答案,是因为这个问题是google angular router页面重新加载问题的最佳结果之一。希望它能为其他人节省时间

在我的例子中,我有一个非常简单的Angular 2(实际上是5)路由配置,除了一个从一个路由到另一个路由的链接会莫名其妙地导致页面重新加载的情况外,它大部分都是有效的。我检查了所有常见的嫌疑犯、表格、提交按钮等


结果是,在点击链接时显示的AngularJS组件的某个地方,有一个
ng include
。文档对此提出了警告,我想这是有原因的。重新调整了模板,以便将
ng include
更改为
templateUrl
,一切正常

我知道它的简单方法,但您也可以将此代码设置为在所有操作完成后在成功事件时刷新路由

window.open('users','u self')


它将重新加载并重定向到用户页面。

不,不是。你能在一个扑克牌中复制吗?可能不会,如果不应该这样做,但我会尝试。至少我们可以调查完整的代码并检查是否有错误。请原谅我的无知,但我找不到任何安装了RC3路由器的plunker运行,我以前从未做过plunker。你有我可以编辑的吗?这就是我第一条评论中的链接应该帮助的;-)清爽结束了!!但我不能确切地说出“false”在做什么,以及它在未来可能导致什么问题。我会再给它做一些测试。谢谢大家!@克里斯:我更新了我的答案,提出了一个更好的解决方案,并做了更多的解释。两种解决方案都很好,但你建议的方案更有意义。所以如果我理解的很好,底线是。。。切勿在水疗中心使用
按钮type=“submit”
:-漂亮的解释!非常感谢。我今天一整天都在为这个问题争论,直到我看到这个。非常感谢。我曾尝试用event.preventDefault()修复它,但这个解决方案要好得多。[routerLink]确实有效,在我的例子中,我在nav之前需要执行逻辑,所以[routerLink]不是一个选项。
save() {
    //Do stuff
    this._router.navigate(['/users', { id: userId } ]);
}
<button class="btn btn-default" type="button"
        (click)="save()">Save</button>
<button class="btn btn-default"
        (click)="save(); false">Save</button>
window.location.href = "/sth";