How to make custom tags with angular 2? -

i have problem custom component. problem link model [(ngmodule)] = "value" , gives error follows:

unhandled promise rejection: template parse errors: can't bind 'ngmodule' since isn't known property of 'gpi-input'. 1. if 'gpi-input' angular component , has 'ngmodule' input, verify part of module. 2. if 'gpi-input' web component add "custom_elements_schema" '@ngmodule.schemas' of component suppress message. (" <div>     <h1>input:</h1>     <gpi-input name="somevalue" [error ->][(ngmodule)]="valueinput">         escriu algu plis!!     </gpi-input> 

the code components are:

import { component, forwardref } '@angular/core'; import { ng_value_accessor, controlvalueaccessor } '@angular/forms';  const noop = () => { };  export const custom_input_control_value_accessor: = {     provide: ng_value_accessor,     useexisting: forwardref(() => gpiinputcomponent),     multi: true };  @component({     selector: 'gpi-input',     template: `<div class="form-group">                     <label>                         <ng-content></ng-content>                     </label>                     <input [(ngmodel)]="value" class="form-control"         (blur)="onblur()">                 </div>`,     providers: [custom_input_control_value_accessor],  }) export class gpiinputcomponent implements controlvalueaccessor {      //the internal data model     private innervalue: = '';      //placeholders callbacks later provided     //by control value accessor     private ontouchedcallback: () => void = noop;     private onchangecallback: (_: any) => void = noop;      //get accessor     value(): {         return this.innervalue;     };      //set accessor including call onchange callback     set value(v: any) {         if (v !== this.innervalue) {             this.innervalue = v;             this.onchangecallback(v);         }     }      //set touched on blur     onblur() {         this.ontouchedcallback();     }      //from controlvalueaccessor interface     writevalue(value: any) {         if (value !== this.innervalue) {             this.innervalue = value;         }     }      //from controlvalueaccessor interface     registeronchange(fn: any) {         this.onchangecallback = fn;     }      //from controlvalueaccessor interface     registerontouched(fn: any) {         this.ontouchedcallback = fn;     }  } 

and app.module.ts

import { ngmodule, custom_elements_schema } '@angular/core'; import { browsermodule } '@angular/platform-browser'; import { formsmodule } '@angular/forms';  import { ngbmodule } '@ng-bootstrap/ng-bootstrap';  import { appcomponent } './app.component'; import { gpiinputcomponent } "../formularis/input/gpi-input";  @ngmodule({     imports: [browsermodule, formsmodule, ngbmodule.forroot()],     declarations: [appcomponent, gpiinputcomponent],     bootstrap: [appcomponent],     schemas: [custom_elements_schema] })  export class appmodule { } 

app.component:

import { component } '@angular/core';  import '../../public/css/styles.css';  @component({     selector: 'my-app',     templateurl: './src/app/app.component.html',     //styleurls: ['./app.component.css'] }) export class appcomponent {     valueinput: string = ""; } 

can dirme problem or give me reference of please. thank you!! =)

note:

i've seen other questions community custom_elements_schema adds file app.module @ngmodule within shcemas, problem persists.

the problem not component showing, component uses component.

<gpi-input name="somevalue" [error ->][(ngmodule)]="valueinput">     escriu algu plis!! </gpi-input> 

[(ngmodule)] should [(ngmodel)]