2017-03-16 5 views
1

각도 2 앱에서 html 템플릿을 가져 오는 데 문제가 있습니다.Typescript 2 와일드 카드 모듈

app.component.ts

import { Component } from '@angular/core'; 

import './app.component.css'; 
import * as template from './app.component.html'; 

@Component({ 
    selector: 'app', 
    template: <string>template 
}) 
export class AppComponent { 
    constructor() { 
     console.log('I am App'); 
    } 
} 

응용 작업을하고 템플릿에서

declare module "*.html" { 
    const content: string; 
    export default content; 
} 

가로드 globals.d.ts에서

하지만 난이 오류 TS2352 수 : 대해서 typeof 유형 ''* .html " '을'string '유형으로 변환 할 수 없습니다. 누군가 해결 방법이 있습니까?

대신이 작업을 수행하고 싶습니다.

import template from './app.component.html'; 

@Component({ 
    template: template 
}) 
... 

그러나 transpiled 코드는 다음과 같이 끝납니다.

var app_component_html_1 = __webpack_require__(653); 
... 
template: app_component_html_1.default 

app_component_html_1은 필요한 문자열입니다. 왜 그들은 .default를 추가합니까?

+1

왜 그렇게하고 있습니까? 왜 단지'templateUrl : './app.component.html''이 아닌가? – jonrsharpe

+0

뒤에서 각도 2 a를 테스트하고 templateUrl을 사용했습니다. 그러나 webpack과 함께 사용하기가 어려웠습니다. 작동시키기 위해 추가 로더 및 단계가 필요했습니다. 템플릿 만 사용하는 것이 더 쉽다고 생각했습니다. xD –

+0

TS 2.2에서 동일한 문제가 있음을 설명하고자합니다. 그러나, 내 HTML 가져 오기 webpack 함께 ng 캐시 로더를 사용하여 템플릿 캐시 키를 해결할 수 있습니다. 나는'. * from templateUrl from './header.template.html'; '을 가지고 있지만,'templateUrl : templateUrl'을 사용하여 지시문을 할당 할 때 OP에서 언급 한 것과 같은 오류가 발생합니다. –

답변

4

수정 export default content; to export = content;이 입력 오류가 해결되었습니다.

전에 Not work

Worked

후해야하고 그에 따라 작동 transpiled 코드 ('기본'을 제거하기 때문에).

+0

이전에 댓글을 추가했습니다. 내가 이것을 설명했던 곳에서 더 이상 저에게 문제가되지 않았습니다. 그러나 어쨌든 고마워요. 누군가 다른 사람이 유용하다고 생각할 수도 있습니다. –

+0

나는 왜 이것이 작동하는지 모르며, TS git 문제에서 보았던 대부분의 해설이 기본값을 사용하기 때문에 버그와 같은 느낌이 듭니다. 그러나, 이것은 내가 지금 가고있는 것입니다. 고맙습니다. –

+1

'export ='는 Typescript 문서에 정의 된 유효한 표현식이므로 의도적으로 생각합니다. https://www.typescriptlang.org/docs/handbook/modules.html#export--and-import--require – Val