文档资料

任务详情

Angular学习

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

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

简介

效果

下面是本教程关于界面的构想:开始是“Dashboard(仪表盘)”视图,来展示最勇敢的英雄。

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

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

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

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

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

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

Angular记录(2)的更多相关文章

  1. Angular记录(11)

    开始使用Angular写页面 使用WebStorm:版本2018.3.5 官网资料 资料大部分有中文翻译,很不错 速查表:https://www.angular.cn/guide/cheatsheet ...

  2. Angular记录(10)

    文档资料 速查表:https://www.angular.cn/guide/cheatsheet 风格指南:https://www.angular.cn/guide/styleguide Angula ...

  3. Angular记录(9)

    文档资料 箭头函数--MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_fun ...

  4. Angular记录(8)

    文档资料 箭头函数--MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_fun ...

  5. Angular记录(7)

    文档资料 箭头函数--MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_fun ...

  6. Angular记录(6)

    文档资料 箭头函数--MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_fun ...

  7. Angular记录(5)

    文档资料 箭头函数--MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_fun ...

  8. Angular记录(4)

    文档资料 箭头函数--MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_fun ...

  9. Angular记录(3)

    文档资料 箭头函数--MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_fun ...

随机推荐

  1. mysql删除表中重复数据,只保留一个最小的id的记录

    语句: delete from table1 where id not in (select minid from (select min(id) as minid from table1 group ...

  2. PHAR系列之导言

    由于之前都是在现成的PHP框架下写web项目,一般都只专注于框架内部的使用跟优化.但是对于一些PHP很有特色的功能跟特性很少过多的深入了解.最近做项目调研的时候偶尔注意到一个PHP中一个比较常见的概念 ...

  3. 谈谈当代大学生学习IT技术的必要性。

    21世纪,人类社会已经从工业时代全面进入信息化时代,IT技术的发展正在影响人类的日常生活.比如,外卖平台给人们的用餐提供了更多的选择,移动支付颠覆了传统的支付方式.网购使得人们的购物更加方便,真正做到 ...

  4. vscode 编写vue

    开启保存时检查代码语法 安装 让配置生效 添加新配置 cnpm install mockjs -D

  5. 消耗CPU和内存的脚本

    用法 ./shell.sh 4 (4为4内核) 查看cpu内核数量 > lscpu 执行后会出现一堆kill命令,方便kill掉进程 #!/bin/bash endless_loop() { e ...

  6. 烦神的斐波那契&&洛谷-1306-斐波那契公约数

    传送门 洛谷1306传送门 -------------------------------------------------------------------------------------- ...

  7. Hadoop的NullWritable

    NullWritable是Writable的一个特殊类,实现方法为空实现,不从数据流中读数据,也不写入数据,只充当占位符,如在MapReduce中,如果你不需要使用键或值,你就可以将键或值声明为Nul ...

  8. iOS开发基础-UITableView基本属性

    设置 UITableView 中 cell 的背景颜色. 示例1:通过 backgroundView 设置. UIView *view1 = [[UIView alloc] init]; view1. ...

  9. CCPC-Wannafly Winter Camp Day1部分题目解析

    Preface 最近恰好不知道做什么题,所以就按老叶要求做上面的比赛. 稍微看了下感觉难度适中,大部分题目偏向联赛难度,当然也有些题目打到了省选题的感觉(基本都是Div1的题) 这里就简单拿一些我做得 ...

  10. 判断语句之单if

    什么是判断语句? 给定一个判断条件,并在程序执行过程中判断该条件是否成立,根据判断结果执行不同的操作,从而改变代码的执行顺序,实现更多的功能,这就是判断语句. 判断语句if if语句第一种格式:if  ...