15
15
3 . 选择 ** Visual C\# **
16
16
4 . 选择 ** ASP.NET Web Application**
17
17
18
- ![ Create new ASP.NET project] ( ../assets/new-asp-project.png )
18
+ ![ Create new ASP.NET project] ( ../assets/images/tutorials/aspnet/ new-asp-project.png )
19
19
20
20
5 . 选择 ** MVC**
21
21
22
- 取消复选 "Host in the cloud" 本指南将使用一个本地示例。 ![ Use MVC template] ( ../assets/new-asp-project-template.png )
22
+ 取消复选 "Host in the cloud" 本指南将使用一个本地示例。 ![ Use MVC template] ( ../assets/images/tutorials/aspnet/ new-asp-project-template.png )
23
23
24
24
运行此应用以确保它能正常工作。
25
25
26
26
## 添加 TypeScript
27
27
28
28
下一步我们为 TypeScript 添加一个文件夹。
29
29
30
- ![ Create new folder] ( ../assets/new-folder.png )
30
+ ![ Create new folder] ( ../assets/images/tutorials/aspnet/ new-folder.png )
31
31
32
32
将文件夹命名为 src。
33
33
34
- ![ src folder] ( ../assets/src-folder.png )
34
+ ![ src folder] ( ../assets/images/tutorials/aspnet/ src-folder.png )
35
35
36
36
### 添加 TypeScript 代码
37
37
38
38
在 ` src ` 上右击并选择 ** New Item** 。 接着选择 ** TypeScript File** 并将此文件命名为 ` app.ts ` 。
39
39
40
- ![ New item] ( ../assets/new-item.png )
40
+ ![ New item] ( ../assets/images/tutorials/aspnet/ new-item.png )
41
41
42
42
### 添加示例代码
43
43
@@ -55,7 +55,7 @@ function sayHello() {
55
55
56
56
右击项目并选择 ** New Item** 。 接着选择 ** TypeScript Configuration File** 保持文件的默认名字为 ` tsconfig.json ` 。
57
57
58
- ![ Create tsconfig.json] ( ../assets/new-tsconfig.png )
58
+ ![ Create tsconfig.json] ( ../assets/images/tutorials/aspnet/ new-tsconfig.png )
59
59
60
60
将默认的 ` tsconfig.json ` 内容改为如下所示:
61
61
@@ -88,7 +88,7 @@ function sayHello() {
88
88
89
89
1 . 在 ** Solution Explorer** 中, 打开 ** Views** \| ** Home** \| ` Index.cshtml ` 。
90
90
91
- ![ Open Index.cshtml] ( ../assets/open-index.png )
91
+ ![ Open Index.cshtml] ( ../assets/images/tutorials/aspnet/ open-index.png )
92
92
93
93
2 . 修改代码如下:
94
94
@@ -109,7 +109,7 @@ function sayHello() {
109
109
1 . 运行项目。
110
110
2 . 在输入框中键入时,您应该看到一个消息:
111
111
112
- ![ Picture of running demo] ( ../assets/running-demo.png )
112
+ ![ Picture of running demo] ( ../assets/images/tutorials/aspnet/ running-demo.png )
113
113
114
114
### 调试
115
115
@@ -118,7 +118,7 @@ function sayHello() {
118
118
3 . 在 ` return ` 那一行上打一个断点。
119
119
4 . 在输入框中键入一些内容,确认TypeScript代码命中断点,观察它是否能正确地工作。
120
120
121
- ![ Demo paused on breakpoint] ( ../assets/paused-demo.png )
121
+ ![ Demo paused on breakpoint] ( ../assets/images/tutorials/aspnet/ paused-demo.png )
122
122
123
123
这就是你需要知道的在ASP.NET中使用TypeScript的基本知识了。接下来,我们引入Angular,写一个简单的Angular程序示例。
124
124
@@ -131,13 +131,13 @@ function sayHello() {
131
131
132
132
在project上右击, 选择 ** Quick Install Package** 。
133
133
134
- ![ Use PackageInstaller to install angular2] ( ../assets/packageinstaller-angular2.png ) ![ Use PackageInstaller to install systemjs] ( ../assets/packageinstaller-systemjs.png ) ![ Use PackageInstaller to install Typings] ( ../assets/packageinstaller-typings.png )
134
+ ![ Use PackageInstaller to install angular2] ( ../assets/images/tutorials/aspnet/ packageinstaller-angular2.png ) ![ Use PackageInstaller to install systemjs] ( ../assets/images/tutorials/aspnet/ packageinstaller-systemjs.png ) ![ Use PackageInstaller to install Typings] ( ../assets/images/tutorials/aspnet /packageinstaller-typings.png )
135
135
136
136
3 . 用 PackageInstaller 安装 es6-shim 的类型文件。
137
137
138
138
Angular 2 包含 es6-shim 以提供 Promise 支持, 但 TypeScript 还需要它的类型文件。 在 PackageInstaller 中, 选择 Typing 替换 npm 选项。接着键入 "es6-shim":
139
139
140
- ![ Use PackageInstaller to install es6-shim typings] ( ../assets/packageinstaller-es6-shim.png )
140
+ ![ Use PackageInstaller to install es6-shim typings] ( ../assets/images/tutorials/aspnet/ packageinstaller-es6-shim.png )
141
141
142
142
### 更新 tsconfig.json
143
143
0 commit comments