Petyo Ivanov petyosi
petyosi
/ app.component.ts
Created
February 9, 2018 15:09
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @Component({ | |
| selector: 'my-app', | |
| template: ` | |
| <div class="container-fluid"> | |
| <div class="page-header"> | |
| <h1>Creating AOT Friendly Dynamic Components with Angular 2</h1> | |
| </div> | |
| <div class="row"> | |
| <div class="col-lg-12"> | |
| <div class="panel panel-default"> |
petyosi
/ app.module.ts
Created
February 9, 2018 15:07
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @NgModule({ | |
| imports: [ | |
| BrowserModule, | |
| FormsModule, | |
| GridModule.withComponents([ | |
| BlueDynamicComponent, | |
| GreenDynamicComponent, | |
| RedDynamicComponent | |
| ]) | |
| ], |
petyosi
/ grid.module.ts
Created
February 9, 2018 15:06
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @NgModule({ | |
| imports: [ | |
| BrowserModule, | |
| FormsModule | |
| ], | |
| declarations: [ | |
| Grid, | |
| Cell | |
| ], | |
| exports: [ |
petyosi
/ cell.component.ts
Created
February 9, 2018 15:05
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @Component({ | |
| selector: 'grid-cell', | |
| template: '' | |
| }) | |
| export class Cell implements OnInit { | |
| @Input() componentType: any; | |
| constructor(private viewContainerRef: ViewContainerRef, | |
| private cfr: ComponentFactoryResolver) { | |
| } | |
| ngOnInit() { |
petyosi
/ app.component.ts
Created
February 9, 2018 15:05
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @Component({ | |
| selector: 'grid-component', | |
| template: ` | |
| <div class="row" *ngFor="let cellComponentType of cellComponentTypes"> | |
| <<div class="col-lg-12"> | |
| <grid-cell [componentType]="cellComponentType"></grid-cell> | |
| </div> | |
| </div> | |
| ` | |
| }) |
petyosi
/ webpack.config.js
Created
February 9, 2018 14:50
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const path = require('path'); | |
| const ExtractTextPlugin = require('extract-text-webpack-plugin'); | |
| module.exports = { | |
| entry: './src/index.js', | |
| output: { | |
| path: path.resolve(__dirname, './dist/'), | |
| filename: 'bundle.js', | |
| publicPath: 'dist/' | |
| }, | |
| module: { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import multiply from './multiply'; | |
| import sum from './sum'; | |
| // import our image utility | |
| import addImageToPage from './image_util'; | |
| // import the images we want to use | |
| import multiplyImg from '../images/multiply.png'; | |
| import sumImg from '../images/sum.png'; |
petyosi
/ image_util.js
Created
February 9, 2018 14:48
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const addImageToPage = (imageSrc) => { | |
| const image = document.createElement('img'); | |
| image.src = imageSrc; | |
| image.style.height = '100px'; | |
| image.style.width = '100px'; | |
| document.body.appendChild(image); | |
| }; | |
| export default addImageToPage; |
petyosi
/ webpack.config.js
Created
February 9, 2018 14:47
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const path = require('path'); | |
| const ExtractTextPlugin = require('extract-text-webpack-plugin'); | |
| module.exports = { | |
| entry: './src/index.js', | |
| output: { | |
| path: path.resolve(__dirname, './dist/'), | |
| filename: 'bundle.js' | |
| }, | |
| module: { | |
| loaders: [ |
petyosi
/ webpack.config.js
Created
February 9, 2018 14:46
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const path = require('path'); | |
| module.exports = { | |
| entry: './src/index.js', | |
| output: { | |
| path: path.resolve(__dirname, './dist/'), | |
| filename: 'bundle.js' | |
| }, | |
| module: { | |
| loaders: [ | |
| { |