Angular ng-click giving Syntax Error: Token '{' invalid key at column 22 of the expression

Question

在我 post 我的问题之前，只是想让你知道我搜索了足够多但找不到解决方案。这个问题很困扰我。

我有以下代码。首先 ng-click 在函数中正确插入 ID，但会生成 angular 错误（在主题中提到）。第二次 ng-click 既不生成错误也不插入 ID，而是呈现文字。

我搜索了所有论坛，大多数人都提到像我的第二次 ng-click 一样使用它，但它对我不起作用。需要帮助！

<tr ng-repeat="registration in vm.filteredList">
    <td>{{registration.id}}</td>
    <td>{{registration.dateModified | date}}</td>
    <td>
        <a class="btn btn-primary" ng-click="vm.editRegistration({{registration.id}})" href="#">E</a>
        <a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#">D</a>
    </td>
</tr>

答案：

我做了一些测试，发现它让新手感到困惑，因为在 FF 的 HTML 检查器或 Chrome 开发人员工具栏中，您会看到代码将呈现

<a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#">D</a>

而不是

<a class="btn btn-danger" ng-click="vm.deleteRegistration(1)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(2)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(3)" href="#">D</a>

但是当实际函数触发时它会传递正确的值。例如下面的函数将接收并显示 1,2,3 等

vm.deleteRegistration = function (id) { alert("ID: " + id)};

希望它解释和帮助。

Answer 1

应该使用

ng-click="vm.editRegistration(registration.id)"

没有{{&}}

Answer 2

我做了一些测试，发现它让新手感到困惑，因为在 FF 的 HTML 检查器或 Chrome 开发人员工具栏中，您会看到代码将呈现

<a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#">D</a>

而不是

<a class="btn btn-danger" ng-click="vm.deleteRegistration(1)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(2)" href="#">D</a>
<a class="btn btn-danger" ng-click="vm.deleteRegistration(3)" href="#">D</a>

但是当实际函数触发时它会传递正确的值。例如下面的函数将接收并显示 1,2,3 等

vm.deleteRegistration = function (id) { alert("ID: " + id)};

希望它解释和帮助。

Answer 3

我正在使用代码：

<div ng-click="joinPublicCourse({{course.id}})"> 
</div>

但是浏览器一直在记录 "Token '{' invalid key at column 19 of the expression...." 错误。

课程的定义是这样的：

course = {
   id: '123',
   ...
}

然后我想angualrjs可以把course.id作为一个变量名，而不是一个普通的字符串。所以我更改了我的代码：

<div ng-click="joinPublicCourse('{{course.id}}')"> 
</div>

这次成功了。

Angular ng-click giving Syntax Error: Token '{' invalid key at column 22 of the expression

Angular ng-click giving Syntax Error: Token '{' invalid key at column 22 of the expression

javascript

angularjs

angularjs-ng-click