CODEWITHSUNDEEP
angularjs
Ege Bayrak
Ege Bayrak

Reputation: 1199

lexerr error with non-english letters

Being fairly new to Angular js, I'm having this error due to ö character.

Lexer Error: Unexpected next character  at columns 8-8 [ö] in expression [item.Teközel].

I'm using ngSanitize like this at the start of my controller

var app = angular.module('xApp', ['smart-table', 'ngSanitize']);

but still during page rendering it gives the error above.

How can I fix this?

Upvotes: 3

Views: 983

Answers (1)

Abdul Mateen Mohammed
Abdul Mateen Mohammed

Reputation: 1894

@Ege Bayrak as unicode characters are present in the variable name this Error: [$parse:lexerr] Lexer Error: Unexpected next character at columns 8-8 [ö] in expression [ctrl.Teközel]. error occurs

If you have a very few variables in the JavaScript object you could do item['Teközel'] in the view to perform the data binding but that might be a bad practice or not a recommended approach I think.

If you are having more unicode identifiers or to do it in a more appropriate way you can read this Lexer support for non-ascii literals #2174 there might be other approaches to solve the problem in a way that suites your needs (and the set of unicode characters you're using) in that issue #2174 thread than the one I've used below.

To fix this issue we can modify a function in the angular.js file which tells whether the identifier used i.e. the variable name is valid or not

I've modified this function isValidIdentifierStart in AngularJS 1.5.8 and the data binding works

isValidIdentifierStart: function(ch) {
    return ('a' <= ch && ch <= 'z' ||
            'A' <= ch && ch <= 'Z' ||
            '_' === ch || ch === '$' ||
            (129 <= ch.charCodeAt(0) && ch.charCodeAt(0) <= 496));
  }

You can search for the statement 'a' <= ch && ch <= 'z' in the version of angular.js file you are using to add the code in order to make the function allow unicode characters

The view

<!DOCTYPE HTML>
<html ng-app="demo">
    <head>
        <title>Demo</title>
    </head>
    <body ng-controller="DefaultController as ctrl">
        <span ng-bind="ctrl.Teközel"></span>

       <script type="text/javascript" src="scripts/angular.js"></script>
       <script type="text/javascript" src="scripts/app/main.js"></script>
    </body>
</html>

The AngularJS code

angular
    .module('demo', [])
    .controller('DefaultController', DefaultController);

    function DefaultController() {
        var vm = this;
        vm.Teközel = 'Hello, World!';
    }

To check whether the identifier name is valid or not we can use this validator

Upvotes: 2

Related Questions