¿Cómo usar ngModel con un control personalizado dentro de un formulario?

Creé un componente para manejar el cuadro de selección, ahora cuando lo pongo en la etiqueta del formulario después del formulario enviado, el resultado de la selección no aparece en la consola.

¿Cuál es el problema con mi código? ¿Cómo puedo arreglar esto?

testOption: es una matriz de objetos que pasé arrojar el cuadro de selección con@Input.

aquí está el componente de cuadro de selección:

import { Component, OnInit, Input } from '@angular/core';

@Component({
    selector: 'input-select',
    template:`
      <div class="field-select">
        <span><icon name="select-arrow" size="10"></icon></span>
        <select name="{{name}}" class="field">
          <option value="0" disabled selected>{{label}}</option>
          <option *ngFor="let option of options" [ngValue]="option.value">{{option.name}}</option>
        </select>
      </div>
    `
})
export class InputSelectComponent implements OnInit {
    @Input() label: string;
    @Input() name: string;
    @Input() options;


    // testOptions = [
    //   {value:'test',name:'test2'},
    //   {value:'test',name:'test2'}
    // ];

    constructor() { }

    ngOnInit() {
      console.log(this.options);
     }

}

Uso en html:

<input-select label="test" name="select2" [options]="testOption"></input-select>

formulario html:

<form role="form" class="form" #f="ngForm" (ngSubmit)="onSubmit(f)">
    <input class="field" name="name" ngModel type="text" placeholder="n1">
    <input-select label="b2" name="select2" [options]="testObject"></input-select>
    <input class="field" name="building-type" type="text" ngModel placeholder="b3">
</form>

registro de consola: (no hay valor de cuadro de selección)

Object {name: "test", building-type: "tset" }

Respuestas a la pregunta(3)

Su respuesta a la pregunta