Question

我正在尝试使用ng-blur。以下是我的HTML代码：

<div ng-if="CurrentStage==='SaveQuery'">
   <div class="col-sm-12">
      <div class="form-group row">
         <label class="col-sm-3 control-label text-right">Query Name</label>
         <div class="col-sm-9">
            <input type="text" ng-blur="performValidationQueryName()" ng-model="QueryName" ng-class="QueryNameError?'form-control validation_error':'form-control'" placeholder="Query Name" />
            <span ng-if="QueryNameErrorMsg!=''" class="errorMsg">{{QueryNameErrorMsg}}</span>
         </div>
         <div class="clearfix"></div>
      </div>
   </div>
</div>

模糊事件调用的JavaScript代码是：

$scope.performValidationQueryName = function () {
    if($scope.QueryName != null && $scope.QueryName != '') {}
};

我面临的问题是：

当div中有ng-if="CurrentStage==='SaveQuery'"时，我的ng-model="QueryName"没有得到更新。通过模糊文本，我得到$scope.QueryName = "" performValidationQueryName函数。

如果我删除了ng-if="CurrentStage==='SaveQuery'"，那么所有内容都能正常运行，我会在$scope.QueryName中获取值。

如何调用放置在ng-blur条件的div中的ng-if？

Answer 1

您应该在输入模型中使用对象来解决您的问题，因为它来自ng-if，如下所示，

<强>模板：

<div ng-if="CurrentStage==='SaveQuery'">
      <div class="col-sm-12">
           <div class="form-group row">
                 <label class="col-sm-3 control-label text-right">Query Name</label>
                 <div class="col-sm-9">
                      <input type="text" ng-blur="performValidationQueryName(Query.Name)" ng-model="Query.Name" ng-class="QueryNameError?'form-control validation_error':'form-control'" placeholder="Query Name" />
                       <span ng-if="QueryNameErrorMsg!=''" class="errorMsg">{{QueryNameErrorMsg}}</span>
                 </div>
                 <div class="clearfix"></div>
             </div>
       </div>
</div>

<强>控制器：

$scope.performValidationQueryName = function (queryName) {
  if (queryName != null && queryName != ''){
    //do something..
  }
};

AngularJS1：ng-if中的ng-blur

1 个答案: