在angular2中的一个组件中添加多个templateUrl

时间:2016-11-30 04:23:03

标签: angular

angular2允许使用反向标记(`)编写多行html代码  但是当使用templateUrl时,我不知道如何添加多个html文件。

当我试试这个..

@Component({
  selector: 'my-app',
  template: `
           <h1>view1</h1>
           <h1>view2</h2>
            `
})

class Appcomponent{

}
像那样。

@Component({
  selector: 'my-app',
  templateUrl: './HTML1.html','./HTML2.html'


})

class Appcomponent{

}

与HTML1.html和HTML2.html一起

HTML1.html

<h1>view1</h1>

HTML2.html

<h1>view2</h1>

我可以在angular2中使用多个templateUrl吗? 感谢您抽出时间阅读本文:)

1 个答案:

答案 0 :(得分:1)

您无法添加多个HTML文件。我也看不出这会达到什么目的。

如果您愿意,可以使用*ngIf*ngSwitchCase仅显示模板的部分内容

@Component({
  selector: 'my-app',
  template: `
           <h1 *ngIf="view == 'view1'>view1</h1>
           <h1 *ngIf="view == 'view2'>view2</h2>
           <button (click)="view = view == 'view1' ? 'view2' : 'view1'">toggle</button>
            `
})

class Appcomponent{
  view = 'view2';
}