Como usar o ngModel com um controle personalizado dentro de um formulário?

Criei um componente para lidar com a caixa de seleção, agora, quando o coloco na tag de formulário após o formulário enviado, o resultado da seleção não aparece no console.

Qual é o problema com o meu código? Como posso consertar isso?

testOption: é a matriz do objeto que passei na caixa de seleção com@Input.

aqui está o componente da caixa de seleção:

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 em html:

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

formulário 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>

log do console: (não há valor da caixa de seleção)

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

questionAnswers(3)

yourAnswerToTheQuestion