想尝试angular
, 但是感觉angular
的模板"不够 typescript"
, 例如官网上的一段template
:
<h2>Products</h2> <div *ngFor="let product of products"> <h3> {{ product.name }} </h3> </div>
单纯看这个模板, 完全看不出来product
的类型, 同时typescript
和eslint
也没能力管控这个模板中的变量。相对的来说, 在react
的tsx
中, typescript
和eslint
是能够对变量进行充分的静态分析的。
无意引战, 确实希望试试angular
, 可是, 是我使用的姿势不对吗?
![]() | 1 gouflv 2020-05-29 15:51:39 +08:00 via iPhone ![]() 你说的没错 |
![]() | 2 wellsc 2020-05-29 15:53:59 +08:00 via iPhone 让我想起了 python 的 jinja2 |
![]() | 3 Oktfolio 2020-05-29 15:58:24 +08:00 ![]() let product of products 不是 TypeScript 的特性吗? products 不就是 Product[] 类型吗?遍历出来不就是 Product 类型吗? |
![]() | 4 weixiangzhe 2020-05-29 15:58:33 +08:00 确实 react 支持更好啊 |
5 hantsy 2020-05-29 15:59:02 +08:00 模板都是有自己一套指令体系(或者叫标签,或者其它),除了 C# /.net 那种带语言,还有传统 JSP 嵌套 Java ( JSP 2.0 支持 XML 语法) 痕迹比较深,其它都差不多。 |
6 FireFoxAhri 2020-05-29 15:59:14 +08:00 这个还好,至少 IDE 能提示变量补全,之前<ng-template>里面 let 的变量。IDE 补全都没有,前段时候试了试 好像总算有提示了,但是还是没有类型信息。。 |
7 hantsy 2020-05-29 16:00:08 +08:00 @weixiangzhe React jsx 那种语法真的丑陋,瞬间找到了写 PHP 4 的感觉。 |
8 faceRollingKB 2020-05-29 16:41:28 +08:00 吓得我赶紧看了一眼,webstorm 有的,2019.3.4 |
![]() | 9 xiaoming1992 OP @FireFoxAhri 这我不太懂, 毕竟 Product 类型是在.ts 文件中定义的, 而在模板文件中, 编辑器都不知道 product 类型是什么, 怎么补全呢? |
![]() | 10 zhuangzhuang1988 2020-05-29 17:53:15 +08:00 |
11 ochatokori 2020-05-29 18:15:38 +08:00 via Android 用 angular language service 插件,其他类型都有检查,但是 for of 的不行,product 会是 any |
12 FireFoxAhri 2020-05-29 18:40:25 +08:00 @xiaoming1992 IDEA 是可以的,包括我说的那种开始不支持,后来 IDEA 更新了后支持了 |
13 chinagxwei 2020-05-29 18:49:09 +08:00 很好奇,楼主 products 在组建类中不会是声明成 any 吧?如果声明是 product[]是会有提示的。难道我用的 IDEA 跟楼主不是同一个? |
![]() | 14 xiaoming1992 OP @chinagxwei 我误解了,原来在`heroes.component.html`文件中,编辑器会自动去`heroes.component.ts`中找`hero`属性。 是我的问题,第一次用 ng new my-app 的时候,不知道怎么回事,vscode 在模板文件中没有智能提示(甚至双大括号内的变量连高亮都没有),我还以为模板文件就是如此呢,刚刚在线尝试了一下才发现是有提示的。 |
15 beyondex 2020-05-30 10:22:26 +08:00 via Android 因为模板和 ts 是分离的两个文件,一个.html 一个 .ts ,vscode 不知道对应哪个类型,webstorm 是可以很好的识别的,vscode 找找有没有插件吧。 |