Angular ng-click给出语法错误:Token '{'表达式第22列处的键无效

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

本文关键字:22列 表达式 无效 ng-click 错误 语法 Token Angular      更新时间:2023-09-26

在我发布我的问题之前,只是想让你知道我搜索了足够多,找不到解决方案。这个问题把我难住了。

我有以下代码。第一次ng-click正确地将ID插入到函数中,但会产生角度误差(在主题中提到)。第二个ng-click既不生成错误,也不插入ID,而是呈现文字。

我搜索了所有的论坛,大多数提到使用它像我的第二次点击,但它不适合我。需要帮助!

<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或Chrome开发者工具栏的HTML检查器中,你会看到代码将呈现

<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)};

应该使用

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

不含{{ &}}

我做了一些测试,发现这对新手来说很困惑,因为在FF或Chrome开发人员工具栏的HTML检查器中,你会看到代码将呈现

<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)};

我使用的代码是:

<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>

这次成功了