p3x-ng2-compile-html

patrik laszlo

Author: p3x-robot

package.json

@@ -1,7 +1,7 @@
 {
  "name": "p3x-ng2-compile-html",
- "version": "1.0.33-16",
- "version-date": "1/16/2017, 8:28:21 PM",
+ "version": "1.0.35-18",
+ "version-date": "1/16/2017, 8:53:13 PM",
  "description": "Angular 2 Service to compile an HTML into a component Edit",
  "main": "src/index.ts",
  "scripts": {

test/angular2/app/Page.ts

@@ -11,42 +11,52 @@ import {CompileHtmlService } from '../../../src';
 @Component({
  selector: 'p3x-ng2-compile-html-text',
  template: `
- <div #container>loading ...</div>
- <div [p3xCompileHtml]="data" [p3xCompileHtmlRef]="ref">loading ...</div>
+ <div #container></div>
+ <hr/>
+ <div [p3xCompileHtml]="data2" [p3xCompileHtmlRef]="ref"></div>
 `,
 })
 @Injectable()
 export class Page implements OnInit {
 
  @ViewChild('container', {read: ViewContainerRef}) container: ViewContainerRef;
 
- data: string;
+ data1: string;
+ data2: string;
 
  ref: Page;
 
- counter : number = 0;
+ counter1 : number = 0;
+ counter2 : number = 0;
 
  constructor( private compileHtmlService: CompileHtmlService ) {
  this.ref = this;
- this.update();
  }
 
- private update() {
- this.counter = this.counter + 1;
- this.data = `<div>Done</div><a href="javascript:void(0);" (click)="ref.alert('ok')">If click works it says OK!</a>${this.counter}`;
+ private update1() {
+ this.counter1++;
+ this.data1 = `
+<div>Service</div><a href="javascript:void(0);" (click)="ref.update1()">Click me via a service!</a>
+<div>${this.counter1}</div>
+`;
+ this.compileHtmlService.compile({
+ template: this.data1,
+ container: this.container,
+ ref: this,
+ })
  }
 
- alert(string: string ) {
- alert(string);
- this.update();
+ private update2() {
+ this.counter2++;
+ this.data2 = `
+<div>Attribute</div><a href="javascript:void(0);" (click)="ref.update2()">Click me via a service!</a>
+<div>${this.counter2}</div>
+`;
  }
 
  ngOnInit() {
- this.compileHtmlService.compile({
- template: this.data,
- container: this.container,
- ref: this,
- })
+ this.update1();
+ this.update2();
  }
 
 }