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
  }
}

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

不幸的是，我收到了错误......

TypeError: Cannot read property 'email' of undefined

我没有在JavaScript registrationForm.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使用的对象未定义？

2 个答案: