html文件里写typescript,关于.net：.cshtml Razor文件中的TypeScript

我正在使用ASP.NET-MVC框架开始一个新项目。我想在这个项目中使用TypeScript代替JavaScript。 Visual Studio可以轻松支持TypeScript，但似乎与(.cshtml)剃刀文件不完全兼容。我可以在.ts文件中创建我的类，并在.cshtml文件中调用这些类，问题是当我将参数传递给.cshtml文件中的对象时，TypeSafety被忽略，并且该函数像类型从未定义。

.ts文件

export class SomeClass {

name: number;

constructor(public tName: number) {

this.name = tName;

}

public sayName() {

alert(this.name);

}

}

.cshtml文件

var instance = new SomeClass("Timmy");

instance.sayName();

如您所见，即使我明确定义了仅接受数字的参数，我也将字符串传递给了构造函数，但是TypeSafely被忽略，TypeScript / JavaScript的执行就好像没有问题一样。

两种文件类型都是Microsoft发明的，因此我对它们之间的友好程度略有惊讶。这还不是世界末日，至少我仍然能够使用面向对象的编程，我很好奇是否有其他人经历过这种情况，并且可以给我一个简短的解释。

我以为tsc将以.ts扩展名编译(Transpile)代码。 我错了吗 ？

TypeScript Transpiler仅检查和转换仅包含以下内容的文件：

Java脚本

由TypeScript添加的带有某些语法糖代码的Javascript(静态类型，通用类等)

CSHTML文件基本上是创建为包含Razor / C＃代码以及HTML / JavaScript / CSS的。

一些开发人员试图将Javascript代码和CSS样式表直接添加到Cshtml文件中，因此这不是一个好习惯。

JavaScript代码以及CSS样式应位于其自己的文件中。然后使用CSHTML中的script(Javascript)或style(CSS)标记引用文件。

不建议将Javascript代码直接放入视图(CSHTML或HTML)中，因为它破坏了以下Unobtrusive JavaScript的原则：

Separation of functionality (the"behavior layer") from a Web page's structure/content and presentation (source Wikipedia)

一些ASP.Net MVC开发人员仍然继续将其Javascript代码直接放入其Razor视图中，因为他们需要将视图模型中的某些数据直接传递给JavaScript代码。当Javascript代码已经在视图中时，很容易传递数据而没有任何复杂性。但是我已经说过这不好;-)。

可以避免这种破坏不干扰JavaScript原则的事情。所有需要JavaScript代码读取的数据都应使用HTML元素中的data属性存储，例如

Hello World

然后在您的TypeScript代码中，只需使用jQuery(或普通javascript)来获取您在CSHTML视图中设置的数据，如下所示：

let tName: number = int.Parse($("#mySpan").data("t-name"));

var instance = new SomeClass(tName);

instance.sayName();

之后，将TypeScript生成的js文件引用到CSHTML中。

希望能帮助到你。

如果您仍然想要在html文件中使用内联打字稿(vue.js倡导类似的做法)，请参阅此github问题中的讨论以了解选项：github.com/Microsoft/TypeScript/issues/12874