为什么 Angular 使用的对象未定义？

Question

我是 Angular 的新手。这是我正在开发的控制器...

svs.controller('registrationCtrl', function($scope, validatorService) {
  $scope.$watch("registrationForm.email.value", function(newValue, oldValue) {
    if (validatorService.validateEmail(newValue))  {
      $scope.registrationForm.email.valid = true;
    } else {
      $scope.registrationForm.email.valid = false;
    }
  });
});

在关联视图中，有一个用户电子邮件的文本输入。它设置为 Angular 使用 $scope.registrationForm.email.value 作为模型。这似乎是这种情况，就好像我从 $watch 函数中删除了所有内容，只做了一个简单的控制台日志，每当我更改文本输入的值时它都会记录。

这里的想法是在 $scope.registrationForm 处有一个看起来类似于此的对象...

{
  email: {
    value: "someEmail@emailProvider.com",
    valid: true
  }
}

我正在尝试查看文本区域的值，使用服务方法来验证电子邮件，并将 registrationForm.email 的 valid 属性设置为 true 有效时。

很遗憾，我遇到了一个错误...

TypeError: Cannot read property 'email' of undefined

我在JavaScriptregistrationForm.email.valid中没有明确定义，在我的观点HTML中也没有提及。

我需要在设置之前创建这个属性吗？这是怎么回事？

Answer 1

您不必这样做，因为... angular 已经做到了。您所需要的只是将属性名称添加到表单和输入中。

    <script>
  angular.module('emailExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.email = {
        text: 'me@example.com'
      };
    }]);
</script>
  <form name="myForm" ng-controller="ExampleController">
    <label>Email:
      <input type="email" name="input" ng-model="email.text" required>
    </label>
    <div role="alert">
      <span class="error" ng-show="myForm.input.$error.required">
        Required!</span>
      <span class="error" ng-show="myForm.input.$error.email">
        Not valid email!</span>
    </div>
    <tt>text = {{email.text}}</tt><br/>
    <tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
    <tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
    <tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
    <tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
    <tt>myForm.$error.email = {{!!myForm.$error.email}}</tt><br/>
  </form>

有更多详细信息here

Answer 2

是的，您必须在设置前创建属性。

$scope.email={};

为什么 Angular 使用的对象未定义？

Why is an object utilized by Angular undefined?

javascript

validation

object

undefined

angularjs