如何在 angularjs 表达式中以数组格式访问 html 元素名称？答案

【问题标题】：How to access html element name in array format inside an angularjs expression?如何在 angularjs 表达式中以数组格式访问 html 元素名称？
【发布时间】：2015-02-27 10:01:58
【问题描述】：

我正在使用 ruby on rails 设计进行身份验证。我需要在客户端验证登录表单。 Devise 使用 user[email] 作为名称属性值。如何在 angularjs ng-show 表达式中使用相同的名称？

<form ng-app="" ng-controller="validateCtrl" name="myForm" novalidate>
    <input type="text" name="user[email]" ng-model="user" required>
    <span ng-show="myForm.user[email].$error.required">Username is required</span>
</form>

user[email] 在 angularjs ng-show 表达式中不起作用。

【问题讨论】：

标签： ruby-on-rails angularjs html devise

【解决方案1】：

Angular 无法访问 ruby on rails 变量。

【讨论】：

它不是一个 ror 变量。它是数组表示法中的 html 元素名称，需要从 angularjs 访问

【解决方案2】：

你可以这样做，这是我使用 devise gem 和 angular 1.3.14 的示例

<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: {name: "profileForm", novalidate: false}) do |f| %>

<div class="field">
    <%= f.label :firstname %><br />
    <%= f.text_field :firstname, autofocus: true, "ng-model"=>"profile.firstname", required: true %>


    <div ng-messages="profileForm['user[firstname]'].$error" class="errors">
      <span ng-message="required">Required!</span>
    </div>
  </div>

<% end %>

注意：您需要在应用中添加 angular-messages.js 和模块

<!DOCTYPE html>
<html ng-app="myApp">

<head>
  <script data-require="angular.js@1.3.14" data-semver="1.3.14" src="https://code.angularjs.org/1.3.14/angular.js"></script>
  <script data-require="angular.js@1.3.14" data-semver="1.3.14" src="https://code.angularjs.org/1.3.14/angular-messages.js"></script>
  .....

在您的 app.js 中

(function() {

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

}());

【讨论】：