Sử dụng tập tin html như mẫu cho thành phần trong góc 2

Question

Tôi đã theo cấu trúc ứng dụng

app 
    home 
     home.html 
     home.ts 
     home.sass 
    app.component.ts 
index.html 

Về cơ bản tôi muốn chia trang của tôi vào các thư mục riêng biệt mà có phong cách, .ts và các file .html liên quan đến họ

tuy nhiên tại thời điểm tải một mẫu như

import {Component} from 'angular2/core'; 

@Component({ 
    selector: 'admin-app', 
    template: 'home/home.html' 
}) 
export class AppComponent { } 

tải văn học "home/home.html" chuỗi này như một mẫu nơi như tôi muốn nội dung html của tập tin home.html.

Answer 1

Tôi nghĩ rằng nếu bạn muốn vượt qua một mẫu, bạn nên sử dụng

templateUrl: 'home/home.html' 

Điều đó sẽ làm cho một http request và tải html vào thành phần của bạn.

Answer 2

Bạn có thể cân nhắc sử dụng Webpack. Trong trường hợp đó, bạn chỉ cần:

@Component({ 
    selector: 'my-comp', 
    template: require('./mycomp.component.html') 
}) 

Tôi đã tìm thấy giải pháp này là một giải pháp vững chắc vì nó thực sự sẽ tạo ra lỗi thời gian biên dịch nếu URL không chính xác.