AngularJs在名称标签中转义括号?

时间:2016-09-21 11:05:47

标签: ruby-on-rails angularjs

有一个Rails项目,一个用户登录设备的表单,但使用ng-show时有问题

  <%= f.email_field :email,class: "form-control", autofocus: true, placeholder: "input your email",required: true,"ng-model"=> "user[email]" %>
</div>
      <div style="color:red;" ng-show="myForm.user[email].$dirty && myForm.user[email].$invalid">
        <p ng-show="myForm.user[email].$error.required" style="float: left">email can't be blank</p>
        <p ng-show="myForm.user[email].$error.email" style="float: left">email is not correct</p>
      </div>

myForm.user [email] 似乎无法获取对象属性,如何在没有更改输入的名称的情况下使此行正常工作。

ng-show="myForm.user[email].$error.required"

换句话说,我们如何逃避[]

1 个答案:

答案 0 :(得分:0)

我对Angular中的Bracket符号没有任何问题。见下面的例子。

var app = angular.module("app", []);

app.controller("ctrl", function($scope) {
  $scope.myForm = {};
  $scope.myForm.user1 = {};
  $scope.myForm.user2 = {};
  $scope.myForm.user1.email = {};
  $scope.myForm.user1.email.error = {};
  $scope.myForm.user1.email.error.required = {};
  $scope.myForm.user2.email = {};
  $scope.myForm.user2.email.error = {};
  $scope.myForm.user2.email.error.required = {};

  $scope.myForm.user1.email.error.required = false;
  $scope.myForm.user2.email.error.required = true;

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="ctrl">
  <div ng-show="myForm['user2'].email.error.required">div1</div>
  <div ng-show="myForm['user1'].email.error.required">div2</div>


{{myForm.user1.email.error.required}} {{myForm.user2.email.error.required}} {{myForm['user1'].email.error.required}} {{myForm['user2'].email.error.required}}
</div>