ng-content

Conditional duplicate templateref in ng-content with selector

大兔子大兔子 提交于 2019-12-20 04:48:32
问题 I have a component which toggles the component's template based on client device size. Component code is: import {Component} from '@angular/core'; import {BreakpointObserver, Breakpoints} from '@angular/cdk/layout'; @Component({ selector: 'ui-switcher', template: ` <ng-content *ngIf="isSmall" select="mobile"></ng-content> <ng-content *ngIf="!isSmall" select="web"></ng-content> ` }) export class UiSwitcherComponent { public isSmall: boolean; constructor(breakpointObserver: BreakpointObserver)

Multiple ng-content

谁说我不能喝 提交于 2019-12-18 10:55:12
问题 I am trying to build a custom component using multiple ng-content in Angular 6, but this is not working and I have no idea why. This is my component code: <div class="header-css-class"> <ng-content select="#header"></ng-content> </div> <div class="body-css-class"> <ng-content select="#body"></ng-content> </div> I am trying to use this component in another place and render two different HTML code inside body and header select of ng-content , something like this: <div #header>This should be

Multiple ng-content

痞子三分冷 提交于 2019-12-18 10:55:03
问题 I am trying to build a custom component using multiple ng-content in Angular 6, but this is not working and I have no idea why. This is my component code: <div class="header-css-class"> <ng-content select="#header"></ng-content> </div> <div class="body-css-class"> <ng-content select="#body"></ng-content> </div> I am trying to use this component in another place and render two different HTML code inside body and header select of ng-content , something like this: <div #header>This should be

Angular 6 multiple ng-content

社会主义新天地 提交于 2019-11-30 01:31:17
I am trying to build a custom component using multiple ng content in angular 6 but this is not working and I have no idea why. This is my component code: <div class="header-css-class"> <ng-content select="#header"></ng-content> </div> <div class="body-css-class"> <ng-content select="#body"></ng-content> </div> I am trying to use this component in another place and render two differents HTML code inside body and header select of ng-content, something like this: <div #header>This should be rendered in header selection of ng-content</div> <div #body>This should be rendered in body selection of ng