Angular Error: $parse:syntax Syntax Error

Question

我正在构建一个示例应用程序（请参阅插件 https://plnkr.co/edit/vDXcSPrOjw5qvBQKcYvw?p=preview）。

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

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.18/angular.min.js"></script>
  <script src="https://cdn.rawgit.com/mattiash/angular-tablesort/master/js/angular-tablesort.js"></script>
  <link rel="stylesheet" href="https://cdn.rawgit.com/mattiash/angular-tablesort/master/tablesort.css">
  <script>
var myApp = angular.module('myApp', ['tableSort'])
  .controller("tableTestCtrl", function tableTestCtrl($scope) {
    $scope.items = [{
      "Id": "01",
      "Name": "A",
      "80th_time": "1.00",
      "median_time": "1"
    }, {
      "Id": "02",
      "Name": "B",
      "80th_time": "10.00",
      "median_time": "1"
    }, {
      "Id": "04",
      "Name": "C",
      "80th_time": "9.50",
      "median_time": "10"
    }, {
      "Id": "03",
      "Name": "a",
      "80th_time": "9.00",
      "median_time": "2"
    }, {
      "Id": "06",
      "Name": "b",
      "80th_time": "100.00",
      "median_time": "2"
    }, {
      "Id": "05",
      "Name": "c",
      "80th_time": "1.20",
      "median_time": "2"
    }];
  });
  </script>
</head>

<body>
  <div ng-controller="tableTestCtrl">
    <table border="1" ts-wrapper>
      <thead>
        <tr>
          <th ts-criteria="Id">Id</th>
          <th ts-criteria="Name|lowercase" ts-default>Name</th>
          <th ts-criteria="80th_time|parseFloat">80th Per Time</th>
          <th ts-criteria="median_time|parseFloat">Median Time</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="item in items track by item.Id" ts-repeat>
          <td>{{ item.Id }}</td>
          <td>{{ item.Name }}</td>
          <td>{{ item.80th_time }}</td>
          <td>{{ item.median_time }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</body>

当我将属性名称从“80th_time”更改为 "th_time" 时，angular 解析工作正常。如果我将属性名称保留为“80th_time”，我会得到以下 $parse 异常：

https://docs.angularjs.org/error/$parse/syntax?p0=th_time&p1=is%20an%20unexpected%20token&p2=3&p3=80th_time%7CparseFloat&p4=th_time% 7CparseFloat

关于为什么会发生这种情况有什么想法吗？

为了测试这个（即触发异常）你可以运行 plunk然后尝试点击header“80th Per Time”（触发基于这个的排序列）。

Answer 1

当您使用符号 item.80th_time 时，您只能使用有效的 variable names。为了使用以数字开头的，您需要以 item['80th_time'].

的形式访问它

Answer 2

来自MDN：

An object property name can be any valid JavaScript string, or anything that can be converted to a string, including the empty string. However, any property name that is not a valid JavaScript identifier (for example, a property name that has a space or a hyphen, or that starts with a number) can only be accessed using the square bracket notation.

Angular Error: $parse:syntax Syntax Error

Angular Error: $parse:syntax Syntax Error

parsing

syntax-error

angularjs