TypeScript bên trong .cshtml Tập tin Razor

Question

Tôi đang bắt đầu một dự án mới bằng cách sử dụng khung công tác ASP.NET-MVC. Tôi muốn sử dụng TypeScript trong dự án này thay cho JavaScript. TypeScript có thể dễ dàng được hỗ trợ bởi Visual Studio nhưng dường như không (hoàn toàn) tương thích với các tệp dao cạo .cshtml. Tôi có thể tạo các lớp của tôi trong tệp .ts và gọi các lớp đó trong tệp .cshtml của tôi, vấn đề là khi tôi chuyển các tham số cho đối tượng trong tệp .cshtml TypeSafety bị bỏ qua và hàm chạy như thể loại không bao giờ được xác định.

.ts nộp

export class SomeClass { 

    name: number; 

    constructor(public tName: number) { 
     this.name = tName; 
    } 

    public sayName() { 
     alert(this.name); 
    } 
} 

.cshtml nộp

var instance = new SomeClass("Timmy"); 
instance.sayName(); 

Như bạn thấy, tôi đi qua một chuỗi các constructor mặc dù tôi xác định rõ ràng các tham số để chỉ chấp nhận các số, nhưng TypeSafely bị bỏ qua và TypeScript/JavaScript thực thi như thể không có vấn đề gì.

Cả hai loại tệp đều do Microsoft phát minh nên tôi hơi ngạc nhiên khi chúng không thân thiện hơn với nhau. Đây không phải là kết thúc của thế giới, ít nhất tôi vẫn có thể sử dụng lập trình hướng đối tượng, tôi chỉ tò mò nếu có ai khác có kinh nghiệm này và có thể có thể cho tôi một lời giải thích ngắn gọn.

Answer 1

nguyên cảo transpiler chỉ kiểm tra và transpiles file chỉ chứa:

• Javascript
• Javascript với một số mã đường syntaxique thêm bằng cách đánh máy (gõ tĩnh, lớp generic vv ...)

Các tệp CSHTML cơ bản được tạo để chứa mã Razor/C# và tất nhiên là HTML/JavaScript/CSS.

Một số nhà phát triển đã cố gắng thêm mã Javascript và biểu định kiểu CSS trực tiếp vào tệp Cshtml và bởi đây không phải là phương pháp hay.

Mã JavaScript và cũng là kiểu CSS phải nằm trong tệp riêng. Sau đó, tham khảo tệp bằng cách sử dụng thẻ script (Javascript) hoặc style (CSS) trong CSHTML của bạn.

Đưa mã Javascript trực tiếp vào tầm nhìn của bạn (CSHTML hay chỉ là HTML) đều không được khuyến khích vì nó phá vỡ Principe sau Unobtrusive JavaScript:

Tách chức năng (các "lớp hành vi") từ một Web cấu trúc/nội dung trang và trình bày (nguồn Wikipedia )

Một số nhà phát triển ASP.Net MVC vẫn tiếp tục đưa mã Javascript của họ trực tiếp vào Razor họ xem BECA sử dụng chúng cần truyền một số dữ liệu từ mô hình khung nhìn trực tiếp tới mã JavaScript. Khi mã Javascript đã có trong chế độ xem, thật dễ dàng để chuyển dữ liệu mà không có bất kỳ biến chứng nào. Nhưng tôi đã nói điều này là không tốt ;-).

Loại sự cố này có thể tránh được các nguyên tắc JavaScript không bị xâm phạm. Tất cả dữ liệu cần được đọc bằng mã JavaScript phải được lưu trữ bằng cách sử dụng thuộc tính dữ liệu trong các phần tử HTML của bạn, ví dụ:

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

Sau đó trong mã nguyên cảo của bạn chỉ cần sử dụng jQuery (hoặc vani javascript) để có được những dữ liệu mà bạn thiết lập trong quan điểm CSHTML của bạn như thế này:

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

Sau đó, tham khảo các tập tin được tạo js từ nguyên cảo vào CSHTML của bạn.

Hy vọng điều đó sẽ hữu ích.