2014-10-09 132 views
0

一旦發現錯誤,我在輸入控件中使用Glyphicon圖標。字形圖標上有錯誤和正確的圖像。但是我想清除輸入控制點擊錯誤圖標。 以下是我的代碼:清除輸入文本AngularJS

<div class="{{layout=='horizontal'? fieldClass || 'col-lg-9':''}} "> 
     <div style="position:relative" class="input-group"> 
      <span class="input-group-addon"><b>PD</b></span> 
      <div class="icon-addo addon-md"> 
       <input type="text" class="form-control {{textboxClass}}" name="textControl" id="textControl" ng-readonly="readonly" ng-required="required" 
         maxlength="10" placeholder="{{placeholder || layout=='inline' ? labelText : ''}}" data-ng-model="vm.value" ng-blur="vm.onBlur()" /> 

       <i ng-show="vm.state==1" class="form-control-feedback fa fa-spinner fa-spin" style="width: auto; height:auto; font-size: 25px; top:5px; right:10px"></i> 
       <i onclick="clearControl(this,'textControl');" class="form-control-feedback" ng-class="{'glyphicon glyphicon-ok': vm.state==2, 'glyphicon glyphicon-remove': vm.state==3}" style="width: auto; height:auto; font-size: 20px; top:0; right:10px"></i> 
      </div> 
     </div> 
     <div ng-show="textForm['textControl'].$error.required && (submitted || !textForm['textControl'].$pristine)" class="help-block ng-hide">{{labelText}} is required</div> 
    </div></i> 

請幫忙。

回答

2

請勿使用內聯onclick處理程序。您可以清除輸入簡單地ngClick指令:

<i ng-click="vm.value = ''" class="form-control-feedback" ng-class="{'glyphicon glyphicon-ok': vm.state==2, 'glyphicon glyphicon-remove': vm.state==3}" style="width: auto; height:auto; font-size: 20px; top:0; right:10px"></i> 

我還建議以清除HTML,移動樣式的CSS文件,它會使你的代碼更加全面。

+0

事實上,後來我用ng-click,但在這裏我想調用一個函數,而不是直接清理字段,因爲我想檢查控制器中的其他值。但你的回答有幫助。謝謝。 – user3169167 2014-10-15 01:31:38