이온 2 템플릿 재사용

Question

나는 여러 페이지에서 재사용 할 수있는 "템플릿"을 갖고 싶습니다. 기본적으로이 html 템플릿을 사용할 각 페이지는 데이터와 함께 개체를 전달하며 템플릿은 개체에 전달합니다.

시나리오

나는 4 개 탭, 탭 1과 탭 2 페이지 섹션이 "이벤트"라고하고 데이터가 이벤트 템플릿마다 다를 수 있지만 같은 HTML 구조가 동일합니다가 , 유일한 차이점은 다른 데이터가있는 이벤트 객체를 전달한다는 것입니다.

"이벤트"템플릿 html을 어디에 두어야하는지,이 두 페이지에 데이터를 추가하고 렌더링시 데이터 객체를 전달하는 방법을 알아야합니다.

Answer 1

구성 요소는 템플릿을 공유 할 수 있으며 구성 요소 데코레이터에 경로를 입력하기 만하면됩니다.

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

시나리오에서는 일부 구성 요소 만 필요하다고 들리는 경우가 있습니다.

나는 (즉,이 이벤트 섹션이있다) 당신의 <events [yourEventsArray]></events> 구성 요소를 추가하는 각 탭에서 events라는 구성 요소와라는 구성 요소 event

$ ionic g component events

$ ionic g component event

을 생성합니다. 이벤트 구성 요소에 <event *ngfor="let event of events" [event]="event"></event> 구성 요소를 추가하십시오.