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


Posted in Javascript onAugust 31, 2018

造成这个问题一般是因为我们在<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刷新页面的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
理解Javascript_13_执行模型详解
Oct 20 Javascript
js中string转int把String类型转化成int类型
Aug 13 Javascript
js实现鼠标滚轮控制图片缩放效果的方法
Feb 20 Javascript
jQuery实现简易的天天爱消除小游戏
Oct 16 Javascript
jQuery实现控制文字内容溢出用省略号(…)表示的方法
Feb 26 Javascript
如何用js实现鼠标向上滚动时浮动导航
Jul 18 Javascript
Three.js学习之几何形状
Aug 01 Javascript
vue 组件 全局注册和局部注册的实现
Feb 28 Javascript
JS点击动态添加标签、删除指定标签的代码
Apr 18 Javascript
Vue高版本中一些新特性的使用详解
Sep 25 Javascript
微信小程序实现的3d轮播图效果示例【基于swiper组件】
Dec 11 Javascript
JavaScript实现联动菜单特效
Jan 07 Javascript
浅谈angularJS2中的界面跳转方法
Aug 31 #Javascript
详解vue使用vue-layer-mobile组件实现toast,loading效果
Aug 31 #Javascript
Angular2之二级路由详解
Aug 31 #Javascript
基于jQuery ztree实现表格风格的树状结构
Aug 31 #jQuery
详解Vue CLI3配置之filenameHashing使用和源码设计使用和源码设计
Aug 31 #Javascript
Bootstrap Table 双击、单击行获取该行及全表内容
Aug 31 #Javascript
vue通过滚动行为实现从列表到详情,返回列表原位置的方法
Aug 31 #Javascript
You might like
php数组转换js数组操作及json_encode的用法详解
2013/10/26 PHP
php实现过滤表单提交中html标签的方法
2014/10/17 PHP
smarty内置函数section的用法
2015/01/22 PHP
php导入模块文件分享
2015/03/17 PHP
用js实现预览待上传的本地图片
2007/03/15 Javascript
js中判断对象是否为空的三种实现方法
2013/12/23 Javascript
js动态创建标签示例代码
2014/06/09 Javascript
给js文件传参数(详解)
2014/07/13 Javascript
jQuery表格插件datatables用法总结
2014/09/05 Javascript
字太多用...代替的方法(两种)
2017/03/15 Javascript
webpack踩坑之路图片的路径与打包
2017/09/05 Javascript
node.js博客项目开发手记
2018/03/16 Javascript
Vue 通过自定义指令回顾v-内置指令(小结)
2018/09/03 Javascript
小程序页面动态配置实现方法
2019/02/05 Javascript
Vue在 Nuxt.js 中重定向 404 页面的方法
2019/04/23 Javascript
vue实现设置载入动画和初始化页面动画效果
2019/10/28 Javascript
基于leaflet.js实现修改地图主题样式的流程分析
2020/05/15 Javascript
google广告之另类js调用实现代码
2020/08/22 Javascript
js实现简单的倒计时
2021/01/28 Javascript
python中join()方法介绍
2018/10/11 Python
Python中函数参数匹配模型详解
2019/06/09 Python
python里dict变成list实例方法
2019/06/26 Python
html5移动端价格输入键盘的实现
2019/09/16 HTML / CSS
武汉英思工程科技有限公司&ndash;ORACLE面试测试题目
2012/04/30 面试题
分别介绍一下Session Bean和Entity Bean
2015/03/13 面试题
优秀党支部事迹材料
2014/01/14 职场文书
简短大学毕业感言
2014/01/18 职场文书
《鸟岛》教学反思
2014/04/26 职场文书
奥巴马经典演讲稿
2014/09/13 职场文书
加强机关作风建设心得体会
2014/10/22 职场文书
五一劳动节活动总结
2015/02/09 职场文书
天河观后感
2015/06/11 职场文书
军事理论课感想
2015/08/11 职场文书
Python机器学习之基础概述
2021/05/19 Python
Java面试题冲刺第十八天--Spring框架3
2021/08/07 面试题
SQL中的连接查询详解
2022/06/21 SQL Server