mdl-textfield not taking ngModel changes into account

Question

I am facing an issue regarding the mdl-textfield\'s behavior

On the below plnkr, follow the steps:

1. click on \"groups working\"
2. cl

Answer 1

You have to manually clean up MDL js text inputs if cleared via scripting. After clearing input value, for example, call this mdlCleanup();.

  //MDL Text Input Cleanup
  function mdlCleanUp(){
    var mdlInputs = doc.querySelectorAll('.mdl-js-textfield');
    for (var i = 0, l = mdlInputs.length; i < l; i++) {
      mdlInputs[i].MaterialTextfield.checkDirty();
    }  
  }