File
Implements
Metadata
| changeDetection |
ChangeDetectionStrategy.OnPush |
| selector |
div[body-text-with-intro-main] |
| styleUrls |
./body-text-with-intro-main.component.scss |
| templateUrl |
./body-text-with-intro-main.component.html |
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
HostBindings
|
|
|
|
Public
embeddedBodyEntities
|
|
|
|
Public
introduction
|
Type : string
|
|
|
import { Component, OnInit, Input, ChangeDetectionStrategy, HostBinding } from '@angular/core';
@Component({
selector: 'div[body-text-with-intro-main]',
templateUrl: './body-text-with-intro-main.component.html',
styleUrls: ['./body-text-with-intro-main.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class BodyTextWithIntroMainComponent implements OnInit {
@Input() entity;
constructor() { }
public embeddedBodyEntities: [];
public deck: string;
public introduction: string;
@HostBinding('class') get class() { return 'col-md-12 space-between'; }
ngOnInit() {
this.embeddedBodyEntities = this.entity.EmbeddedBodytext;
this.deck = this.entity.Deck;
this.introduction = this.entity.Introduction;
}
}
<div class="body-text-with-intro-main">
<div class="row">
<div class="deck col-12 mb-4" *ngIf="deck">
{{deck | uppercase}}
</div>
<div class="intro col-sm-12 col-md-4 mb-sm-5" *ngIf="introduction">
{{introduction}}
</div>
<div class="rtf col-sm-12 col-md-8"
[ngClass]="{'offset-md-4': !introduction}"
*ngIf="embeddedBodyEntities?.length > 0">
<ng-container *ngFor="let bodyTextEntity of embeddedBodyEntities">
<rich-text-field [body]="bodyTextEntity.BodyText"></rich-text-field>
</ng-container>
</div>
</div>
</div>
@import "src/app/styles/helpers";
.body-text-with-intro-main {
color: $cool-grey;
.deck {
@include font-scale(14, uppercase);
}
.intro {
@include font-scale(44, light);
}
.rtf {
::ng-deep p {
@include font-scale(18, light);
}
}
}
Legend
Html element with directive