“Angular2”的版本间的差异
来自tomtalk
（→QuickStart） |
（→The Hero Editor） |
||
| 第28行： | 第28行： | ||
=The Hero Editor= | =The Hero Editor= | ||
| + | |||
| + | ==The Hero Editor== | ||
Let’s take stock of what we’ve built. | Let’s take stock of what we’ve built. | ||
| 第35行： | 第37行： | ||
* We can both display and change the hero’s name after adding a two-way data binding to the <input> element using the built-in ngModel directive. | * We can both display and change the hero’s name after adding a two-way data binding to the <input> element using the built-in ngModel directive. | ||
* The ngModel directive also propagates changes to every other binding of the hero.name. | * The ngModel directive also propagates changes to every other binding of the hero.name. | ||
| + | |||
| + | ==Master/Detail== | ||
| + | |||
| + | Here’s what we achieved in this chapter: | ||
| + | |||
| + | * Our Tour of Heroes now displays a list of selectable heroes | ||
| + | * We added the ability to select a hero and show the hero’s details | ||
| + | * We learned how to use the built-in directives ngIf and ngFor in a component’s template | ||
2016年9月28日 (三) 07:09的版本
QuickStart
0、安装npm。
1、新建项目文件夹angular2，放入4个初始文件。
package.jon
tsconfig.json
typings.json
systemjs.config.js
2、安装包，项目文件夹下就会新增node_modules、typings文件夹。
npm install
3、在项目文件夹根下运用文件夹app，新增3个运用文件。
app.component.ts
app.module.ts
main.ts
4、在项目文件夹下新增2个文件。
index.html
types.css
5、编辑、运行程序。使用Browsersync来动态刷新页面。
npm start
The Hero Editor
The Hero Editor
Let’s take stock of what we’ve built.
- Our Tour of Heroes uses the double curly braces of interpolation (a kind of one-way data binding) to display the application title and properties of a Hero object.
- We wrote a multi-line template using ES2015’s template strings to make our template readable.
- We can both display and change the hero’s name after adding a two-way data binding to the <input> element using the built-in ngModel directive.
- The ngModel directive also propagates changes to every other binding of the hero.name.
Master/Detail
Here’s what we achieved in this chapter:
- Our Tour of Heroes now displays a list of selectable heroes
- We added the ability to select a hero and show the hero’s details
- We learned how to use the built-in directives ngIf and ngFor in a component’s template
