.cshtml Razor 파일 내의 TypeScript

Question

ASP.NET MVC 프레임 워크를 사용하여 새 프로젝트를 시작합니다. JavaScript 대신이 프로젝트에서 TypeScript를 사용하고 싶습니다. TypeScript는 Visual Studio에서 쉽게 지원되지만 .cshtml 면도기 파일과 완벽하게 호환되지는 않습니다. .ts 파일 내에서 클래스를 만들고 내 .cshtml 파일 내에서 해당 클래스를 호출 할 수 있습니다. 문제는 .cshtml 파일의 개체에 매개 변수를 전달할 때입니다. TypeSafety는 무시되고 함수는 다음과 같이 실행됩니다. 유형이 정의되지 않았습니다.

.TS는, 내가 분명히에만 매개 변수를 정의에도 불구하고 생성자에 문자열을 전달하고 볼 수 있듯이

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

파일 .cshtml

export class SomeClass { 

    name: number; 

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

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

파일 숫자를 허용하지만 TypeSafely는 무시되고 TypeScript/JavaScript는 문제가없는 것처럼 실행됩니다.

두 가지 파일 형식이 모두 Microsoft에서 고안 한 것이므로 서로 조금 친숙하지는 않습니다. 이것은 세계의 끝이 아니다. 적어도 나는 여전히 객체 지향 프로그래밍을 사용할 수있다. 다른 누군가가 이것을 경험했는지에 대해 궁금 할 뿐이며, 나에게 간단한 설명을 줄 수있다.

Answer 1

타이프 라이터의 transpiler은 검사 만 포함 된 파일 transpiles :

• 자바 스크립트 타이프에 의해 추가 된 일부 syntaxique 설탕 코드
• 자바 스크립트 (정적 입력, 제네릭 클래스 등 ...)

CSHTML 파일은 Razor/C# 코드와 물론 HTML/JavaScript/CSS를 포함하도록 기본적으로 생성됩니다.

일부 개발자는 Javascript 코드와 CSS 스타일 시트를 Cshtml 파일에 직접 추가하려고 시도하지만 좋은 방법은 아닙니다.

JavaScript 코드 및 CSS 스타일은 자체 파일에 있어야합니다. 그런 다음 CSHTML에 script (자바 스크립트) 또는 style (CSS) 태그를 사용하여 파일을 참조하십시오. 웹에서 기능

분리 (이하 "행동 계층")가 Unobtrusive JavaScript의 다음 프린을 깰 때문에보기 (CSHTML하거나 HTML)에 직접 자바 스크립트 코드를 넣는

는

하지 않는 것이 좋습니다 페이지의 구조/내용과 표현 (소스 위키 백과)

가

이 일부 ASP.Net MVC 개발자는 여전히 면도기로 직접 자바 스크립트 코드를 넣어 계속

은 베카 전망 뷰 모델의 일부 데이터를 JavaScript 코드로 직접 전달해야합니다. Javascript 코드가 이미 뷰에 있으면 복잡한 일없이 데이터를 전달하기 쉽습니다. 그러나 나는 이미 이것이 좋지 않다라고 말했다 ;-).

방해되지 않는 JavaScript 원칙을 위반하는 이러한 종류의 문제는 피할 수 있습니다. 자바 스크립트 코드에서 읽어야하는 모든 데이터는 HTML 요소의 데이터 속성을 사용하여 저장해야합니다.

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

그런 다음 타이프 코드에서 당신이처럼 CSHTML보기에서 설정 한 데이터를 얻기 위해 jQuery를 (또는 자바 스크립트 바닐라)를 사용 : 그 후

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

를 타이프에서 JS 생성 된 파일을 참조 귀하의 CSHTML에.

희망이 있습니다.