為什么ng-show無法正常工作？

Question

我使用asp.net mvc 5和angularjs開發Web應用程序。 我想知道為什么ng-show無法正常工作或不顯示消息。

angularjs代碼：

 vm.checkEmailFormat = function () {
        var email = $(".pv-company-email").val();

        var regex = /^[\w-]+(\.[\w-]+)*@([a-z0-9-]+(\.[a-z0-9-]+)*?\.[a-z]{2,6}|(\d{1,3}\.){3}\d{1,3})(:\d{4})?$/i;

        vm.validEmailFormat = (regex.test(email));

        if (vm.validEmailFormat) {
            vm.pageValidated = true;
        } else {
            vm.pageValidated = false;
        }
    }

查看代碼：

<div class="row">
  <div class="col-md-3 settings-padding"><span class="textdescription"><strong>Email Address</strong></span></div>
  <div class="col-md-6 settings-padding">
    <input type="text" ng-model="vm.organisation.Email" ng-blur="vm.checkIsEmailBlank()" ng-keyup="vm.checkEmailFormat()" placeholder="Email" class="form-control comp pv-company-email" style="max-width:420px;" maxlength="250" />
  </div>
  <div class="col-md-3 settings-padding"><span class="error company-error" ng-show="!vm.validEmailFormat"><span class="company-border-top"><i class="fa fa-times-circle ngdialog-register-erroricon" aria-hidden="true"></i></span> &nbsp;&nbsp;&nbsp;Invalid email format.</span>
  </div>
  @*
  <div class="col-md-3 settings-padding"><span class="error company-error" ng-show="vm.isEmailEmpty"><span class="company-border-top"><i class="fa fa-times-circle ngdialog-register-erroricon" aria-hidden="true"></i></span> &nbsp;&nbsp;&nbsp;Email is required.</span>
  </div>
  <div class="col-md-3 settings-padding"><span class="error company-error" ng-show="vm.validEmailLength"><span class="company-border-top"><i class="fa fa-times-circle ngdialog-register-erroricon" aria-hidden="true"></i></span> &nbsp;&nbsp;&nbsp;Must be 50 characters long only.</span>
  </div>*@

</div>

Answer 1

在視圖中，您必須使用<input type="text" ng-model="controllerAliseName.organisation.Email" ng-blur="controllerAliseName.checkIsEmailBlank()" ng-keyup="controllerAliseName.checkEmailFormat()" placeholder="Email" class="form-control comp pv-company-email" style="max-width:420px;" maxlength="250" /> <input type="text" ng-model="controllerAliseName.organisation.Email" ng-blur="controllerAliseName.checkIsEmailBlank()" ng-keyup="controllerAliseName.checkEmailFormat()" placeholder="Email" class="form-control comp pv-company-email" style="max-width:420px;" maxlength="250" />虛擬機的Insetad vm. ，並且一旦在模糊功能上發現ng-model="controllerAliseName.organisation.Email"為空，就需要將vm.isEmailEmpty標志vm.isEmailEmpty true。 您沒有檢查條件

Answer 2

在這里，您需要在視圖中應用變量更改。 請嘗試以下操作：

if (vm.validEmailFormat) {
    $scope.$apply(function () {
        vm.pageValidated = true;
    });
}
else{
    $scope.$apply(function () {
        vm.pageValidated = false;
    })
}