解决Angular2 router.navigate刷新页面的问题

 更新时间:2018年08月31日 09:37:16   作者:erciyuan_nuonuo  
今天小编就为大家分享一篇解决Angular2 router.navigate刷新页面的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

造成这个问题一般是因为我们在<form>表单中使用<button>时忘记添加type属性,在表单中,如果忘记给按钮添加属性,会默认为submit,如果在子元素中会向上冒泡触发submit

<button (click)="toDetail()">detail</button>
toDetail() {
 this._router.navigate(['/detail']);
}

解决方法:

1.添加type

<button type="button" (click)="toDetail()">detail</button>

2.click添加false

<button (click)="toDetail();false">detail</button>

3.函数返回false

toDetail:boolean(){
 return false;
}

以上这篇解决Angular2 router.navigate刷新页面的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • angular ngClick阻止冒泡使用默认行为的方法

    angular ngClick阻止冒泡使用默认行为的方法

    这篇文章主要介绍了angular ngClick阻止冒泡使用默认行为的方法,较为详细的分析了AngularJS中ngClick事件执行原理与阻止冒泡的实现技巧,需要的朋友可以参考下
    2016-11-11
  • AngularJS中的指令实践开发指南(二)

    AngularJS中的指令实践开发指南(二)

    这篇文章主要介绍了AngularJS中的指令实践指南(二)的相关资料,需要的朋友可以参考下
    2016-03-03
  • AngularJS实现表单验证

    AngularJS实现表单验证

    客户端表单验证是AngularJS里面最酷的功能之一。 AngularJS表单验证可以让你从一开始就写出一个具有交互性和可相应的现代HTML5表单。在AngularJS中,有许多表单验证指令。在这里,我们将谈谈几个最流行指令,然后我们将讨论如何编写自定义的验证。
    2015-01-01
  • AngularJS 实现点击按钮获取验证码功能实例代码

    AngularJS 实现点击按钮获取验证码功能实例代码

    本文通过实例代码给大家介绍了AngularJS 实现点击按钮获取验证码功能,代码简单易懂,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2017-07-07
  • AngularJS中的拦截器实例详解

    AngularJS中的拦截器实例详解

    这篇文章主要介绍了AngularJS中的拦截器实例详解的相关资料,需要的朋友可以参考下
    2017-04-04
  • 浅谈Angular路由守卫

    浅谈Angular路由守卫

    这篇文章主要介绍了浅谈Angular路由守卫,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • Material(包括Material Icon)在Angular2中的使用详解

    Material(包括Material Icon)在Angular2中的使用详解

    这篇文章主要介绍了Material(包括Material Icon)在Angular2中的使用,需要的朋友可以参考下
    2018-02-02
  • angular 实时监听input框value值的变化触发函数方法

    angular 实时监听input框value值的变化触发函数方法

    今天小编就为大家分享一篇angular 实时监听input框value值的变化触发函数方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • Angular中使用嵌套Form的详细步骤

    Angular中使用嵌套Form的详细步骤

    Angular响应式表单使用显式的、不可变的方式,管理表单在特定的时间点上的状态,下面这篇文章主要给大家介绍了关于Angular中使用嵌套Form的详细步骤,需要的朋友可以参考下
    2022-04-04
  • 浅谈angular2子组件的事件传递(任意组件事件传递)

    浅谈angular2子组件的事件传递(任意组件事件传递)

    今天小编就为大家分享一篇浅谈angular2子组件的事件传递(任意组件事件传递),具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09

最新评论