ngx-dynamic-compiler/README.md

  

# NgxDynamicCompiler

  

Dyanmic Template Compiler --with AOT SUPPORT `Maintained by PRAKASH THOMAS VARGHESE`. Angular 7+

  
  

  

>  - Supports Angular Directives ( like *ngFor ) and Data Bindings ( for ex. String Interpolation {{Data.Name}} ) as well.

  

  

  

The purpose of creating this repository was to provide for a way to compile component dynamically on the fly.

  

  

## Online Demo

  

  

**[Stackblitz - Online Demo](https://stackblitz.com/edit/ngx-dynamic-compiler)**

  

  

## Getting Started

  

  

  

Install the package :

  

  

  

`npm i ngx-dynamic-compiler --save`

  

  

  

Import the module :

  

  

`import { NgxDCModule } from 'ngx-dynamic-compiler';`

  

  

  

Add `NgxDCModule` to your root module Imports.

  

  

  

`imports: [ BrowserModule, FormsModule,NgxDCModule ]`

  

  

  

## Usage

  

  

  

In Your Component HTML add the selector

  

  

    ## app.component.html
   
    <ngx-dc  [Data]="bindData"  [Template]="template"  ></ngx-dc>

  

  

In Your Component TS

  

  

    ## app.component.ts
    
      
    
    import {Component, OnInit} from '@angular/core';
    

    @Component({
			    selector: 'app-root',
			    templateUrl: './app.component.html',
			    styleUrls: ['./app.component.scss']
	})
    
      
    
    export class AppComponent implements OnInit {
    
	    template = `<h1> String Interpolation Result - {{Data.Result}}</h1>
	    
				    <ol>
					    <li  *ngFor="let r of Data.ArraySample"  >{{r}}</li>
				    </ol>`;
	  
	    bindData = {
				     Result:'Hola !, Coffee ?',
				    ArraySample: ['Tea', 'Green Tea'] 
				    };
	    
	      
	    
	    constructor() { }
	   
	    ngOnInit() {}
    
      
    
    }
    
      

  

  

## Input Bindings

  

  

  

[Data] : `Provide your json data to be binded with the template`,

  

  

  

[Template] : `You can use your angular template with all the directives like *ngFor ,*ngIf and perform data binding operations as well.Output events are not provided, but shall be included in future versions`,

  

  

  

## Further help

  

  

  

You can drop a mail at `ptvx001@gmail.com`.