dart for the web ：Tour of Heroes第一天

应用简介

有一个重要的项目是构建个一个帮助人事机构管理英雄的app，这个应用涵盖了Angular的核心基础，并且有如你期望它是一个完整的，数据驱动的app。包含获取显示英雄列表，编辑选择的英雄详情，在不同的英雄数据试图之间导航。你将学会下面的一些内容：

● 使用内置指令显示和隐藏元素，并且显示英雄数据列表。

●创建组建去显示英雄的详情和列表。

● 对只读数据进行单向数据绑定。

● 用双向数据绑定去编辑一个字段来更新数据模型。

● 把组件方法绑定到用户事件，比如单击和键盘事件

● 允许用户从主列表选择英雄，并且在信息详情视图编辑该英雄。

● 格式化数据用管道（|）

● 创建一个公共的组建去组装所有的英雄

● 在不同的页面和组建之间用路由去导航。

你将学会足够的Angular 核心知识，并且有信心开始使用Angular做任何你想做的事情。当你完成这个指南，你的app是这个样子。（源码）

操作指南

从仪表盘视图和最厉害的英雄开始：

start

你可以点击“Dashboard” 和“Heroes”在两个不同视图之间进行导航。

假如你点击Dashboard面板上的“Magneta”，将出现英雄详情视图，方便你去编辑英雄的信息。

2

点击返回按钮可以返回“Dashboard”视图，顶部的链接可以带你去任意一个主页面，假如你点击“Heroes”，这个app将展示“Heroes”列表视图。

3

当你点击不同的英雄名字，下方的只读英雄区域将反射你点击的英雄名字。你也能点击“View Details”按钮，深入了解编辑你选择的英雄。如下是导航图：

4

下面是app的操作

5

下一步

你将一步一步构建这个app，每一步的需求你都可能在其他app中遇到过。

出处：

ps：该教程是从dart 官网中dart for the web的教程，搬运过来的，并且进行汉化。英语能力强可以无视该文档，直接点上面的出处去阅读原文。闲来无事，联系一下自己的英语翻译能力和语言组织能力。