Question

我在这里苦苦挣扎（我还是编程的新手），我有一个重复列表（页面上的页面）的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);
    }
});

我环顾四周，但几乎所有的修复工作都是删除{{}}，有些已经工作，因为它渲染不正确但似乎我的渲染正确。

如果有人有任何想法，那将是一个很好的帮助：）

Answer 1

您可以直接从视图访问范围变量，因此您不需要getCtrlScope（）函数。此外，角度指令中的所有变量都是范围，因此您不需要括号{{}}

试试这个

<li class="page-item" ng-repeat="page in Pages">
    <a class="page-link" ng-click="currentPage = page">{{ page }}</a>
</li>

语法错误：令牌'{'无效键 - 即使正确显示也会出错

1 个答案: