我正在尝试将我的HTML标头重用于Ionic 4应用程序中的其他页面。
我的代码如下。我有:
了header.html
<ion-view>
<ion-grid>
<ion-row>
<ion-col col-6 class="font">
<ion-avatar item-start>
<img src="../../assets/imgs/ppc_logo.svg">
</ion-avatar>
</ion-col>
<ion-col col-6 class="header_font">
<p>BUILDER'S APP</p>
</ion-col>
</ion-row>
</ion-grid>
</ion-view>
Home.html中
<ion-view>
<ion-content>
<header> </header>
</ion-content>
</ion-view>
我想再次使用它作为其他页面中的指令,而不是在每个页面中复制整个代码。
请协助
答案 0 :(得分:4)
确切地说组件用于什么。使用要作为组件模板重复使用的HTML代码段,并为该组件提供描述性的选择器。然后你就可以重新使用了它!
@Component({
selector: 'my-reusable-component',
template: `<div>template goes here </div>`
})
export class ReusableComponent { }
您可以阅读有关Angular components in the official documentation的更多信息。