angularjs输入命名空间

Question

在 angularjs 中，我习惯于使用点符号来命名我的模型。但是，在处理表单和输入时，如果我给我的输入一个 ng-model，而不是添加到表单的范围，它会添加到表单所在的同一范围。有没有办法改变这种行为？这是我的意思的一个例子

这是创建它的代码

<form id="login-form" name="loginForm">
            <label for="login-username" class="hidden">Username </label>
            <input id="login-username" ng-minlength="5" type="{{Login.settings.login}}" name="username" ng-model="username" placeholder="Username" required ng-class="{error: !Login.validate(loginForm.username)}" />
            <span class="error" ng-class="{hidden: Login.validate(loginForm.username)}">{{loginForm.username.validation[1]}}</span>
            <label for="login-password" class="hidden">Password </label>
            <input id="login-password" type="password" name="password" ng-model="password" placeholder="Password" required ng-class="{error: !Login.validate(loginForm.username)}" />
            <span class="error" ng-class="{hidden: Login.validate(loginForm.password)}">{{loginForm.password.validation[1]}}</span>
            <input class="button expand radius" type="submit" value="Login"/>
</form>

如您所见，表单上有一个用于用户名和密码字段的对象，命名空间为[form name].[field name]，该对象包含该输入的所有错误和其他信息，我正在为其保存一些自定义值例如验证数组；但是该字段的实际值似乎填充在与 loginForm 相同的范围内，而不是作为子对象的一部分。我想做的是像{{[form name].[field name].value}} 这样来获得价值。我希望我所说的有道理，如果需要，我很乐意澄清。

Answer 1

视图中的所有内容都将添加到$scope（如果在此处定义），因此您的设置为$scope.username 而不是$scope.loginForm.username。

你可以像这样更明确：

<form id="login-form" name="loginForm">
  <label for="login-username" class="hidden">Username </label>
  <input id="login-username" ng-minlength="5" type="{{Login.settings.login}}" name="username" ng-model="loginForm.username" placeholder="Username" required ng-class="{error: !Login.validate(loginForm.username)}" />
  <span class="error" ng-class="{hidden: Login.validate(loginForm.username)}">{{loginForm.username.validation[1]}}</span>
  <label for="login-password" class="hidden">Password </label>
  <input id="login-password" type="password" name="password" ng-model="loginForm.password" placeholder="Password" required ng-class="{error: !Login.validate(loginForm.username)}" />
  <span class="error" ng-class="{hidden: Login.validate(loginForm.password)}">{{loginForm.password.validation[1]}}</span>
  <input class="button expand radius" type="submit" value="Login"/>
</form>