Angular2 返回时组件生命周期函数不被调用的解决方法

这两天使用 Angular2 遇到的一个 @angular/router 的 bug:

症状

@angular/router 版本 3.0.0-beta.2

  1. 使用 safari 浏览器,iOS 的都可以

  2. 打开 Angular2 官方的范例项目

  3. 点击导航栏上的 Heroes 转到 Heroes 列表页

  4. 后退回到 Dashboard 页面,正常情况下应该有的四个 Heroes 没有出现

桌面 safari 或 iOS 的都可以,使用 router 导航到一个新页面,然后后退,原页面 Component 的生命周期函数不会被调用,导致页面表现不正常。

解决方法

已经有人修复了:fix(router): back button does not work in IE11 and Safari

但至本文成文还没有更新到最新的 router npm 模块里。不急的话等 router 下个版本应该就修复了。临时应急的话可以自行修改项目目录下的node_modules/@angular/router/src/router.js 的 282 和 284 行即可

this.locationSubscription = this.location.subscribe(Zone.current.wrap(function (change) {
    return _this.scheduleNavigation(_this.urlSerializer.parse(change['url']),change['pop']);
}));

相关文章

AngularJS 是一个JavaScript 框架。它可通过 注:建议把脚本放在 元素的底部。这会提高网页加载速度,因...
angluarjs中页面初始化的时候会出现语法{{}}在页面中问题,也即是页面闪烁问题。出现这个的原因是:由于...
AngularJS 通过被称为指令的新属性来扩展 HTML。AngularJS 指令AngularJS 指令是扩展的 HTML 属性,带有...
AngularJS 使用表达式把数据绑定到 HTML。AngularJS 表达式AngularJS 表达式写在双大括号内:{{ expres...
ng-repeat 指令可以完美的显示表格。在表格中显示数据 {{ x.Name }} {{ x.Country }} 使用 CSS 样式为了...
$http是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。读取 JSON 文件下是存储在web服务器上...