离子2模板重用

Question

我希望有一个可以在多个页面上重用的“模板”，基本上，使用这个html模板的每个页面都会传递数据对象，模板将根据传递的对象呈现。

场景

我有4个选项卡，制表符1和标签2页有一个名为" events“的部分，每个事件模板的数据将不同，但是它将具有相同的html相同的结构，唯一的区别将是我传递具有不同数据的events对象。

只需要知道如何将"events“模板html放在哪里，以及如何将其添加到这2页中，并在呈现时传递数据对象。

Answer 1

组件可以共享模板，只需在组件装饰器中输入路径即可。

例如：

//page 1
@Component({
   templateUrl: "path/to/template"
})
//page 2
@Component({
   templateUrl: "path/to/template"
})

在您正在描述的场景中，听起来您只需要一些组件。

我将生成一个名为events的组件和一个名为event的组件

$ ionic g component events

$ ionic g component event

在每个选项卡(其中有一个事件部分)中，添加您的<events [yourEventsArray]></events>组件。在events组件中添加<event *ngfor="let event of events" [event]="event"></event>组件