Question

这是我们可以在正常功能中验证的代码：

<p>Username:<br>
  <input type="text" name="username" ng-model="username" required>
  <span style="color:red" ng-show="articleForm.username.$dirty && articleForm.username.$invalid">
  <span ng-show="articleForm.username.$error.required">Username is required.</span>
  </span>
</p>

但是当我的标题字段有代码时：

<header class="list-group-item-text">
  <label>Title</label>
  <input type="text" name="title" ng-model="$parent.mopost.title" class="form-control" required>
  <span class="help-inline" ng-show="articleForm.$parent.mopost.title.$error.required">Required</span>
</header>

和控制器：

$scope.mopost = {title:"",content1:"",content2:"",linkaudio:""};

现在在Angular中验证，它无法运行。我如何验证上述对象的属性。

Answer 1

＆＃13;

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>

  <h2>Validation</h2>

  <form ng-app="myApp" ng-controller="demoCtrl" name="articleForm" novalidate>
    <header class="list-group-item-text">
      <label for="title">Title</label>
      <input id="title" type="text" name="user" ng-model="user" class="form-control" required>
      <span ng-show="articleForm.user.$error.required">Username is required.</span>
    </header>

    <input type="submit" ng-disabled="articleForm.user.$dirty && articleForm.user.$invalid ||  
                                          articleForm.email.$dirty && articleForm.email.$invalid">
  </form>

  <script>
    var app = angular.module('myApp', []);
    app.controller('demoCtrl', function($scope) {
      $scope.title = '';
    });
  </script>

</body>

</html>

＆＃13;

如何用对象中的属性验证表单角度？

1 个答案: