Skip to content

Instantly share code, notes, and snippets.

View natmegs's full-sized avatar

Natalie Smith natmegs

67 followers · 1 following
  • Vancouver
View GitHub Profile
@natmegs
natmegs / host.component.ts
Created December 20, 2017 23:16
Alternative addComponent method
addComponent() {
let factory = this.resolver.resolveComponentFactory(DynamicComponent);
this.container.createComponent(factory);
}
@natmegs
natmegs / host.component.ts
Created December 20, 2017 23:15
Create addComponent method
import { Component } from '@angular/core';
import { DynamicComponent } from './dynamic.component';
@Component({
selector: 'host',
templateUrl: './host.component.html',
styleUrls: [ './host.component.css' ],
entryComponents: [DynamicComponent]
})
export class AppComponent {
@natmegs
natmegs / host.component.html
Created December 20, 2017 23:14
Add button to view
<button (click)="addComponent()">Add Component</button>
<ng-container #container></ng-container>
@natmegs
natmegs / host.component.ts
Created December 20, 2017 23:13
Get reference to ViewContainer
import { Component } from '@angular/core';
import { DynamicComponent } from './dynamic.component';
@Component({
selector: 'host',
templateUrl: './host.component.html',
styleUrls: [ './host.component.css' ],
entryComponents: [DynamicComponent]
})
export class AppComponent {
@natmegs
natmegs / host.component.html
Created December 20, 2017 22:39
Add view container to host view
<ng-container #container></ng-container>
@natmegs
natmegs / host.component.ts
Created December 20, 2017 22:38
Add imports to host component
import { DynamicComponent } from './dynamic.component';
@Component({
selector: 'host',
templateUrl: './host.component.html',
styleUrls: [ './host.component.css' ],
entryComponents: [DynamicComponent]
})
@natmegs
natmegs / dynamic.component.ts
Created December 20, 2017 22:37
Dynamic component
import { Component, Input } from '@angular/core';
@Component({
selector: 'hello',
template: `<h1>Hello {{name}}!</h1>`,
styles: [`h1 { font-family: Lato; }`]
})
export class DynamicComponent {
@Input() name: string;
}
@natmegs
natmegs / host.component.html
Created December 20, 2017 22:36
Skeleton host template
<h1>We'll change this soon</h1>
@natmegs
natmegs / host.component.ts
Created December 20, 2017 22:35
Skeleton host component
import { Component } from '@angular/core';
@Component({
selector: 'host',
templateUrl: './host.component.html',
styleUrls: [ './host.component.css' ]
})
export class AppComponent {
}
@natmegs
natmegs / index.html
Created November 18, 2017 01:06
JS Bin // source https://jsbin.com/geyokey
<script src="https://unpkg.com/@reactivex/rxjs@5.0.3/dist/global/Rx.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>