I want to share some HTML (layout) between some of my components but not
all.
The app.compomonent:
<div class="classA">
<router-outlet></router-outlet>
</div>
Some of my components, but not all, share some HTML:
*Component X*
<div class="classB">
<h2>{{Subtitle}}</h2>
</div>
<div class="classC">
X_SPECIFIC_HTML
</div>
*Component Y*
<div class="classB">
<h2>{{Subtitle}}</h2>
</div>
<div class="classC">
Y_SPECIFIC_HTML
</div>
I want to define the shared HTML (note the data binding) with a place
holder for the actual component HTML:
<div class="classB">
<h2>{{Subtitle}}</h2>
</div>
<div class="classC">
INSERT_COMPONENT_HTML_HERE
</div>
So my components can be defined like this:
*Component X*
X_SPECIFIC_HTML
*Component Y*
Y_SPECIFIC_HTML
Current routes:
const appRoutes: Routes = [
{ path: 'x', component: XComponent },
{ path: 'y', component: YComponent }
];
Is this possible?
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
