材料設計ライトをフォーミングしないフォーム上の要素

Question

私は、実証のために材料設計ライトを使用しています。読み込み時にバックエンドデータがあらかじめ設定されたフォームのページがあります。私は、角使っナビゲートする際に、フォームフィールドのラベルフォーマットが正しく

が適用されていないことに気づいたページを再読み込みするか、入力の値を変更し、URLを直接アクセスする際に予想されるように、フォーマットが適用され

コード

<div class="mdl-cell--12-col"> 
    <div> 
     <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label"> 
      <input class="mdl-textfield__input" type="text" id="name" name="name" ng-model="vm.benefit.name"> 
      <label class="mdl-textfield__label" for="name">Nombre</label> 
     </div> 
    </div> 
    <div> 
     <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label"> 
      <textarea class="mdl-textfield__input" type="text" rows="2" id="description" ng-model="vm.benefit.description"></textarea> 
      <label class="mdl-textfield__label" for="description">Descripción</label> 
     </div> 
    </div> 
</div> 
<div class="mdl-grid"> 
    <div class="mdl-cell--4-col"> 
     <h6>Tipo</h6> 
     <ul class="demo-list-control mdl-list"> 
      <li class="mdl-list__item" ng-repeat="type in vm.benefitTypes"> 
       <span class="mdl-list__item-primary-content"> 
        {{type.text}} 
       </span> 
       <span class="mdl-list__item-secondary-action"> 
        <label class="demo-list-radio mdl-radio mdl-js-radio mdl-js-ripple-effect" for="list-option-{{type.id}}"> 
         <input type="radio" id="list-option-{{type.id}}" class="mdl-radio__button" name="options" value="Descuento directo" ng-model="vm.benefit.type" checked /> 
        </label> 
       </span> 
      </li> 
     </ul> 
    </div> 

componentHandler.upgradeAllRegistered()の呼び出しは変更されません。どんな手掛かり？

Answer 1

入力にコンテンツを入力すると、最初に各入力フィールドにクラスis-dirtyが追加されます。ここでそのコンポーネントの動作を確認できます：https://codepen.io/anon/pen/EjRLVL

Keep rocking！