@symbol 破角表达式答案

【问题标题】：@ symbol breaking angular expression@symbol 破角表达式
【发布时间】：2015-11-10 17:46:29
【问题描述】：

以下 html 因 @ 符号而中断。除了不使用 @ 符号之外，还有什么解决方法。我必须使用 @ 符号，因为 json 将通过使用来自 xml 的 newtonsoft jsonconvert http://www.newtonsoft.com/json 在 c# web api 中生成。 jsonconvert 在生成的 json 中使用 @ 符号为 xml 属性添加前缀。

如何解决@符号问题？对我有用的一件事是 message.root.node1["@attr1"]。如果可能，请提供详细说明角度变量/表达式中禁止使用哪些符号的资源。

<html ng-app="countryApp">
  <head>
    <meta charset="utf-8">
    <title>Angular.js JSON Fetching Example</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
    <script>
      var countryApp = angular.module('countryApp', []);
      countryApp.controller('CountryCtrl', function ($scope, $http) {
            $scope.message = { "root": { "node1": { "@attr1": "1", "@attr2": "2" }, "node2": { "@attr1": "3", "@attr2": "4" } } }

      });
    </script>
  </head>
  <body ng-controller="CountryCtrl">
    <h2>Angular.js JSON Fetching Example</h2>

      <span>
        menudatetime {{message.root.node1.@attr1}}
      </span>


  </body>
</html>

【问题讨论】：

谷歌搜索任何带有@符号的东西都非常烦人。有什么建议吗？

标签： javascript c# json angularjs json.net

【解决方案1】：

使用message.root.node1['@attr1']。

它基本上是 Angular 的 JavaScript 表达式。 message.root.node1.@attr1 不是有效的 javascript...

【讨论】：

我刚刚在我的回答中添加了一条评论。你是第一个所以你得到奖品

【解决方案2】：

您可以切换到括号表示法作为一种解决方法：

<html ng-app="countryApp">
  <head>
    <meta charset="utf-8">
    <title>Angular.js JSON Fetching Example</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
    <script>
      var countryApp = angular.module('countryApp', []);
      countryApp.controller('CountryCtrl', function ($scope, $http) {
            $scope.message = { "root": { "node1": { "@attr1": "1", "@attr2": "2" }, "node2": { "@attr1": "3", "@attr2": "4" } } }

      });
    </script>
  </head>
  <body ng-controller="CountryCtrl">
    <h2>Angular.js JSON Fetching Example</h2>

      <span>
        menudatetime {{message.root.node1['@attr1']}}
      </span>


  </body>
</html>

【讨论】：

【解决方案3】：

在这种情况下，您应该使用数组访问器（括号表示法）：

 <span>
        menudatetime {{message.root.node1.["@attr1"]}}
 </span>

关于表达式可以做什么及其限制的文档，请转到 Angular 文档中的 https://docs.angularjs.org/guide/expression。

【讨论】：

【解决方案4】：

使用这个

{{message.root.node1["@attr1"]}}

jsbin

来自 MDN：

括号表示法

get = object[property_name];
object[property_name] = set;

property_name 是一个字符串。字符串不必是有效标识符；它可以有任何价值，例如“1foo”、“!bar!”，甚至是“”（空格）。

document['createElement']('pre');

这与前面的示例完全相同。

【讨论】：