1

我目前面临以下问题：

我想使用 AngularngModel指令验证我的表单输入。

将它们与 $scope 一起使用时，它们可以正常工作。
现在，使用controllerAs语法，它们无法工作。

这个问题的文档很少，我能找到的唯一帮助是这篇文章。

这是我的代码的一个小例子：

模板被myController 作为 vm调用

<form name="vm.signUpForm" ng-submit="vm.signup(vm.user)">

    <label for="name">Name</label>

      <input type="text"
                  class="form-control"
                  id="name"
                  name="name"
                  placeholder="Full name"
                  ng-model="vm.user.name"
                  ng-minlength="2" required />

    <div ng-show="vm.signUpForm.$submitted || vm.signUpForm.name.$touched">
        <span ng-show="vm.signUpForm.name.$error.required">Please fill in your name</span>
        <span ng-show="vm.signUpForm.name.$error.minlength">A minimum of 2 [...]</span>
    </div>

[...]
</form>

我是否被迫使用$scope来验证表格？还是我错过了什么？

提前致谢！

解决方案： Andrew Gray

我必须更改以下几行才能使其正常工作：

<form name="vm.signUpForm" ... >
<!-- To -->
<form name="signUpForm" ...>


<div ng-show="vm.signUpForm.$submitted || vm.signUpForm.name.$touched">
<!-- To -->
<div ng-if="signUpForm.name.$invalid">

<span ng-show="vm.signUpForm.name.$error.required" ... >
<!-- To -->
<span ng-show="signUpForm.name.$error.required" ... >
4

1 回答 1

4

首先要做的事情-您不需要vm.表格上的。

<form novalidate name="someForm">
    <label>
        Some Text:
        <span class="danger-text" ng-if="someForm.someText.$invalid">
           ERROR!
        </span>
    </label>
    <input type="text" name="someField" />
</form>

它最终的工作方式是有一个不绑定到范围的验证对象。语法只是将controllerAs控制器的一个实例作为范围变量分离出来。

尝试vm.从表单和子元素的名称中删除，你应该没问题。

于 2015-03-30T16:46:15.767 回答