Angular 2表格选择＆＃39;永远有效

Question

我找到了一些关于我的类似问题的帖子，但我仍然无法弄明白（或者从中做出）。

我有一个这样的表格：

<form #clientForm="ngForm" (ngSubmit)="onSubmit()">
      <div class="form form-group col-md-6">
        <label for="Client_No">Client #</label>
        <input type="text" class="form-control" id="Client_No"
               required maxlength="20"
               name="Client_No" [(ngModel)]="client.Client_No"
               #Client_No="ngModel" />
        <div [hidden]="Client_No.valid || Client_No.pristine" class="alert alert-danger">Client Number is Required</div>
      </div>
      <div class="form form-group col-md-6">
        <label for="Client_Name">Name</label>
        <input type="text" class="form-control" id="Client_Name"
               required maxlength="50"
               name="Client_Name" [(ngModel)]="client.Client_Name"
               #Client_Name="ngModel" />
        <div [hidden]="Client_Name.valid || Client_Name.pristine" class="alert alert-danger">Client Name is Required</div>
      </div>
      <div class="form form-group col-md-12">
        <label for="Client_Add1">Address 1</label>
        <input type="text" class="form-control" id="Client_Add1"
               required maxlength="50"
               name="Client_Add1" [(ngModel)]="client.Client_Add1"
               #Client_Add1="ngModel" />
        <div [hidden]="Client_Add1.valid || Client_Add1.pristine" class="alert alert-danger">Address is Required</div>
      </div>
      <div class="form form-group col-md-12">
        <label for="Client_Add2">Address 2</label>
        <input type="text" class="form-control" id="Client_Add2"
               maxlength="50"
               name="Client_Add2" [(ngModel)]="client.Client_Add2"
               #Client_Add2="ngModel" />
        <!--<div [hidden]="Client_Add1.valid || Client_Add1.pristine" class="alert alert-danger">Address is Required</div>-->
      </div>
      <div class="form form-group col-md-4">
        <label for="Client_City">City</label>
        <input type="text" class="form-control" id="Client_City"
               required maxlength="50"
               name="Client_City" [(ngModel)]="client.Client_City"
               #Client_City="ngModel" />
        <div [hidden]="Client_City.valid || Client_City.pristine" class="alert alert-danger">City is Required</div>
      </div>
      <div class="form form-group col-md-4">
        <label for="Client_State">State</label>        
        <select class="form-control" id="Client_State"
                required
                name="Client-State" [(ngModel)]="client.Client-State"
                #Client_State="ngModel">             
          <!--<option *ngFor="let state of states" [value]="state.abbreviation">
            {{state.name}}
          </option>-->          
        </select> 
        <div [hidden]="Client_State.valid || Client_State.pristine" class="alert alert-danger">State is Required</div>
      </div>
      <div class="form form-group col-md-4">
        <label for="Client_Zip">Zip</label>
        <input type="text" class="form-control" id="Client_Zip"
               required maxlength="5"
               name="Client_Zip" [(ngModel)]="client.Client_Zip"
               #Client_Zip="ngModel" />
        <div [hidden]="Client_Zip.valid || Client_Zip.pristine" class="alert alert-danger">Zip is Required</div>
      </div>
    </form>

这与模型有关：

export class Clients {
    constructor(
        public Id: string = '',
        public Client_No: string = '',
        public Client_Name: string = '',
        public Client_Add1: string = '',
        public Client_Add2: string = '',
        public Client_City: string = '',
        public Client_State: string = '',
        public Client_Zip: string = '',
        public Date_Added: string = '',
        public Last_Updated: string = '',
        public isActive: boolean = true       
    ) { }
}

我将状态下拉列表绑定到状态列表，并将状态对象的值绑定到＆＃39; Client_State＆＃39;。我的问题是，无论我做什么，状态下拉列表始终有效，尽管没有选择任何内容。见图： Angular 2 Drop Down always valid

我想我必须遗漏一些关于Angular如何处理对象的双向绑定的东西。我错过了什么？