文档资料

• 箭头函数--MDN：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions

• 箭头函数--ES6文档：http://es6.ruanyifeng.com/#docs/function#箭头函数

• Promise 对象--JS教程：https://wangdoc.com/javascript/async/promise.html
• Promise--ES6文档：http://es6.ruanyifeng.com/#docs/promise
• Promise--MDN：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise

• Promise.prototype.then()--MDN：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/then

• 教程：英雄指南：https://www.angular.cn/tutorial#tutorial-tour-of-heroes
• 工作区与项目文件的结构：https://www.angular.cn/guide/file-structure
• 组件简介：https://www.angular.cn/guide/architecture-components

• CLI 命令参考手册：https://www.angular.cn/cli

任务详情

Angular学习

教程：英雄指南：https://www.angular.cn/tutorial#tutorial-tour-of-heroes

按照上面教程跑一边，做图文记录

简介

效果

下面是本教程关于界面的构想：开始是“Dashboard（仪表盘）”视图，来展示最勇敢的英雄。

仪表盘顶部中有两个链接：“Dashboard（仪表盘）”和“Heroes（英雄列表）”。 你将点击它们在“仪表盘”和“英雄列表”视图之间导航。

当你点击仪表盘上名叫“Magneta”的英雄时，路由会打开英雄详情页，在这里，你可以修改英雄的名字。

点击“Back（后退）”按钮将返回到“Dashboard（仪表盘）”。 顶部的链接可以把你带到任何一个主视图。 如果你点击“Heroes（英雄列表）”链接，应用将把你带到“英雄”列表主视图。

当你点击另一位英雄时，一个只读的“微型详情视图”会显示在列表下方，以体现你的选择。

你可以点击“View Details（查看详情）”按钮进入所选英雄的编辑视图。

下面这张图汇总了所有可能的导航路径。