Angular 2和Material Design Lite无法更新输入

Question

在使用Material Design Lite组件的表单上使用ngModel时，我的应用程序出现问题。我被警告说我必须创建一个指令，如示例代码所示。

import {Directive, AfterViewChecked, AfterViewInit} from '@angular/core';

declare var componentHandler: any;

@Directive({
  selector: '[mdl]'
})
export class MDL implements AfterViewChecked, AfterViewInit{

  ngAfterViewChecked() {
    if (componentHandler) {
      componentHandler.upgradeAllRegistered();
    }
  }

  ngAfterViewInit(){
    if (componentHandler) {
      console.log('ngAfterViewInit ',componentHandler);
      componentHandler.upgradeAllRegistered();
    }    
  }
}

并在组件模板中使用：

<div mdl class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
...
</div>

好的，这是有效的。但是当我在表单中使用[(ngModel)]时，我注意到该指令对输入没有影响。只需删除再次有效的[(ngModel)]即可。如果我使用MDL复选框例如。

<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="remember">
    <span class="mdl-switch__label">{{strings.label_remember}}</span>  
    <input name="remember" type="checkbox" id="remember" class="mdl-switch__input" [(ngModel)]="sess.persistent">
</label>

复选框的初始值不会呈现给用户。即使我使用checked属性启动输入。我不知道我是否清楚。