Angular 2 with vanilla Javascript - Pass data into input from HTML -
i'm trying write component using angular 2 vanilla javascript, want use component on regular html page, , want able pass data component customize it.
this have far:
index.html
<!doctype html> <html> <head> <meta charset="utf-8"> </head> <body> <!-- i'm using component here --> <process-code id="processid" name="processname"></process-code> <script src="node_modules/core-js/client/shim.min.js"></script> <script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/reflect-metadata/reflect.js"></script> <script src="node_modules/rxjs/bundles/rx.umd.js"></script> <script src="node_modules/@angular/core/core.umd.js"></script> <script src="node_modules/@angular/common/common.umd.js"></script> <script src="node_modules/@angular/compiler/compiler.umd.js"></script> <script src="node_modules/@angular/platform-browser/platform-browser.umd.js"></script> <script src="node_modules/@angular/platform-browser-dynamic/platform-browser-dynamic.umd.js"></script> <!-- i'm including component here --> <script src="process-code.js"></script> </body> </html>
process-code.js
"use strict"; (function(){ var processcode = ng.core.component({ selector:'process-code', templateurl: 'process-code.html', inputs: ['id', 'name'] }).class({ constructor: function(){ this.processcode = null; this.id = null; this.name = null; } }) document.addeventlistener('domcontentloaded', function() { ng.platformbrowserdynamic.bootstrap(processcode); }); })();
process-code.html
<label>process</label> <input [id]="id" [name]="name" [(ngmodel)]="codigoprocesso">
this how component being rendered:
<process-code id="processid" name="processname"><label>process</label> <input id="null" name="null" class="ng-untouched ng-pristine ng-valid"> </process-code>
i expecting id , name attributes of input
contain values specified on index.html page, apparently they're not being initialized.
i know i'm missing.
Comments
Post a Comment