我在这里很挣扎(我仍然是编程新手),我有一个 ng-repeat 正在重复一个列表(页面上的页面),它在前端显示正确的数字(即 1)但是,当我尝试对 ng-click 使用相同的方法,它会抛出此错误:
Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 31 of the expression [getCtrlScope().currentPage = {{ page }}] starting at [{ page }}].
奇怪的是,它会在 HTML 代码中正确显示它,但无法运行。
代码:
<li class="page-item" ng-repeat="page in Pages">
<a class="page-link" ng-click="getCtrlScope().currentPage = {{ page }}">{{ page }}</a>
</li>
以 HTML 形式呈现时显示的内容:
<li class="page-item ng-scope" ng-repeat="page in Pages">
<a class="page-link waves-effect ng-binding" ng-click="getCtrlScope().currentPage = 2">2</a>
</li>
JS
var MyApp = angular.module('MyApp', []);
MyApp.controller('MyCtrl', function ($scope, $filter) {
$scope.Users = tJSONData;
$scope.currentPage = 0;
$scope.pageSize = 3;
$scope.search = '';
$scope.Pages = [1, 2, 3];
$scope.getData = function () {
return $filter('filter')($scope.Users, $scope.search)
}
$scope.updatePage = function() {
$scope.$apply(function () {
$scope.Users = tJSONData
})
}
$scope.numberOfPages = function () {
return Math.ceil($scope.getData().length / $scope.pageSize);
}
$scope.getCtrlScope = function () {
return $scope;
}
});
MyApp.filter('startFrom', function () {
return function (input, start) {
start = +start; //parse to int
return input.slice(start);
}
});
我环顾四周,但几乎所有的修复都是通过删除 {{ }} 来解决的,其中一些修复是有效的,因为它渲染不正确,但看起来我的渲染正确。
如果有人有任何想法,这将是一个很大的帮助:)
最佳答案
您可以直接从 View 访问范围变量,因此不需要 getCtrlScope() 函数。此外, Angular Directive(指令)内的所有变量都是作用域,因此您不需要括号 {{}}
试试这个
<li class="page-item" ng-repeat="page in Pages">
<a class="page-link" ng-click="currentPage = page">{{ page }}</a>
</li>
关于javascript - 语法错误: Token '{' Invalid Key - Errors even when displaying correctly,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44162957/