import { Component , OnInit , ViewEncapsulation } from '@angular/core' ; import { DomSanitizer } from '@angular/platform-browser' ; import { IBlogPost } from '../../interfaces/IBlogPost' ; @ Component ( { selector : 'uxd-blog' , templateUrl : './blog.component.html' , styleUrls : [ './blog.component.less' ] , encapsulation : ViewEncapsulation . None } ) export class BlogPageComponent { posts : IBlogPost [ ] ; constructor ( private domSanitizer ) { this . posts = [ { title : 'Data Visualization with UX Aspects' , author : 'Alastair McKee' , category : 'Technical' , datestamp : 'October 17th' , content : require ( './posts/2017-10-17-Data-Visualization-with-UX-Aspects.md' ) } , { title : 'End-to-end testing using Protractor' , author : 'Pearse McMurray' , category : 'Technical' , datestamp : 'August 24th' , content : require ( './posts/2017-08-24-Protractor-Testing.md' ) } , { title : 'Angular Productivity' , author : 'Ashley Hunter' , category : 'Technical' , datestamp : 'May 25th' , content : require ( './posts/2017-05-25-Angular-Productivity.md' ) } , { title : 'Bundle Optimization' , author : 'Ashley Hunter' , category : 'Technical' , datestamp : 'May 25th' , content : require ( './posts/2017-05-25-Bundle-Optimization.md' ) } , { title : 'Custom Validation Functions' , author : 'Gavin Neeson' , category : 'Technical' , datestamp : 'Jan 27th' , content : require ( './posts/2017-01-27-Custom-Validation-Functions.md' ) } , { title : 'UX Aspects Components - a tidy UX design' , author : 'Gavin Neeson' , category : 'Technical' , datestamp : 'Oct 10th' , content : require ( './posts/2016-10-10-Why-use-UX-Aspects.md' ) } , { title : 'Angular Performance Tips' , author : 'Ashley Hunter' , category : 'Technical' , datestamp : 'Oct 10th' , content : require ( './posts/2016-10-10-11-Angular-Performance.md' ) } , { title : 'Power of UX Aspects' , author : ' Gita Narasimhan' , category : 'Technical' , datestamp : 'Oct 9th' , content : require ( './posts/2016-10-09-Power-of-UX-Aspects-Blog.md' ) } ] ; this . posts . forEach ( post => { post . content = this . domSanitizer . bypassSecurityTrustHtml ( post . content ) as string ; } ) ; } togglePost ( post , event ) { post . expanded = ! post . expanded ; event . preventDefault ( ) ; } }