如何使用无效字符访问对象属性答案

【问题标题】：How to access object property with invalid characters如何使用无效字符访问对象属性
【发布时间】：2014-01-10 23:02:24
【问题描述】：

我正在编写一个 Angular 应用程序，该应用程序与已在使用的 Google Analytics API 交互。 Google 返回的数据以“ga:”为前缀，如示例“ga:newVisits”。

如果我使用表达式 {{total.ga:newVisits}}，Angular 无法解析它。任何试图转义冒号以继续的尝试都导致了错误或完全转义了我的表达。

如何将 {{total.ga:newVisits}} 传递给 Angular 以使表达式正常工作？

<!doctype html>
  <html ng-app="AnalyticsApp">
    <head>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script>
      <script src="angular-controller.js"></script>
    </head>
    <body ng-controller="AnalyticsCtrl">
      <ul>
        <li ng-repeat="total in result">
          {{total.ga:newVisits}}
        </li>
      </ul>
    </body>
  </html>

【问题讨论】：

{{total['ga:newVisits']}}

标签： javascript regex angularjs google-analytics

【解决方案1】：

在 JavaScript 中，可以通过点表示法或括号表示法访问对象属性。点表示法通常更简洁，但有限制。如您所见，您的属性包含无效字符，因此无法通过点表示法访问。因此，解决方案是使用如下括号符号访问属性：total['ga:newVisits']，以便您的完整代码为{{total['ga:newVisits']}}。 Live demo here (click).

括号表示法的另一个不错的功能是它允许您将变量名用作属性：

var myObj {
  bar: '123'
};
var foo = 'bar';

console.log(myObj[foo]); //logs '123'

【讨论】：

我删除了我之前的评论。你是 100% 正确的。感谢您不仅回答，而且详细的解释！
@VSack 好的，很高兴它成功了！我做了这个以防万一：jsbin.com/OPOyeXOS/2/edit Stack Overflow 更多的是用于学习，而不仅仅是修复错误，所以我总是试图让我的答案成为一个教学机会。谢谢欣赏！！

【解决方案2】：

您需要像访问关联数组一样访问它：

{{total['ga:newVisits']}}

【讨论】：