2016-11-04 37 views
8

我開始使用ASP.NET-MVC框架的新項目。我想在這個項目中使用TypeScript代替JavaScript。 TypeScript很容易被Visual Studio支持,但似乎不能(完全)與.cshtml razor文件兼容。我可以在.ts文件中創建我的類並在我的.cshtml文件中調用這些類,問題是當我將參數傳遞給.cshtml文件中的對象時,TypeSafety被忽略,並且函數運行得如同類型從未被定義。.cshtml中的T​​ypeScript Razor文件

的.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執行就好像沒有問題一樣。

這兩種文件類型都是由微軟發明的,所以我略微感到驚訝,他們彼此之間並沒有更友好的關係。這不是世界末日,至少我仍然能夠使用面向對象的編程,我只是好奇,如果有其他人已經經歷了這一點,並可以給我一個簡短的解釋。

+1

我以爲tsc會用'.ts'擴展名編譯(Transpile)代碼。我錯了嗎 ? – Shyju

回答

6

打字稿transpiler僅檢查和transpiles只包含文件:

  • 的Javascript
  • 的Javascript與打字稿添加了一些syntaxique糖代碼(靜態類型,泛型類等)

CSHTML文件基本上被創建爲包含Razor/C#代碼,當然還包括HTML/JavaScript/CSS。

有些開發人員試圖將JavaScript代碼和CSS樣式表直接添加到Cshtml文件中,這不是一個好習慣。

JavaScript代碼和CSS樣式應該在它自己的文件中。然後在您的CSHTML中使用script(Javascript)或style(CSS)標籤來引用該文件。

直接把Javascript代碼到您的視圖(CSHTML或只是HTML),不推薦,因爲它打破了Unobtrusive JavaScript以下普林西:從Web

分離的功能(以下簡稱「行爲層」)頁面的結構/內容和形式(來源維基百科

一些ASP.Net MVC開發人員仍然繼續直接把他們的Javascript代碼到他們的剃刀意見貝科使用它們需要將視圖模型中的一些數據直接傳遞給JavaScript代碼。當Javascript代碼已經在視圖中時,很容易傳遞數據而沒有任何複雜性。但我已經說過這不好;-)。

這種打破Unobntrusive JavaScript principes的東西是可以避免的。所有需要通過JavaScript代碼讀取的數據應該通過在HTML元素中使用data屬性來存儲,例如

<span id="mySpan" data-t-name="123456">Hello World</span> 

然後在你的打字稿代碼只是使用jQuery(或香草的javascript),讓你在你的CSHTML視圖設置這樣的數據:

let tName: number = int.Parse($("#mySpan").data("t-name")); 
var instance = new SomeClass(tName); 
instance.sayName(); 

之後,引用來自打字稿生成的js文件到你的CSHTML中。

希望它有幫助。

相關問題