'Error: [$parse:lexerr] Lexer Error: Unexpected next character' on heroku deploy

Question

I wrote an angular app using yeoman generator. It works great in development, but after I deploy to heroku and visit a specific page I get this error:

Error: [$parse:lexerr] Lexer Error: Unexpected next character  at columns 0-0 [\] in expression [\].
http://errors.angularjs.org/1.2.6/$parse/lexerr?p0=Unexpected%20nextharacter%20&p1=s%200-0%20%5B%5C%5D&p2=%5C
    at http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:3:30474
    at Zd.throwError (http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:6:14396)
    at Zd.lex (http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:6:13696)
    at $d.parse (http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:6:16445)
    at http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:5:13197
    at e.parseAs (http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:5:23401)
    at Object.e.(anonymous function) [as parseAsResourceUrl] (http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:5:23604)
    at http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:6:28873
    at q (http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:4:23046)
    at h (http://ang-news.herokuapp.com/scripts/244c37f5.vendor.js:4:19250) 

This description says the error occurs when an expression has a lexical error.

What's that and why is it only showing up in production?

Answer 1

I had some error while I used ng-click

<a ng-click="#/search/San+Francisco">test</a> 

instead of ng-href

<a ng-href="#/search/San+Francisco">test</a> 

I hope it might help

Answer 2

If you are using ng-pattern='/some_reg_ex/'. Please save it in some scope variable, say $scope.emailPattern = '/email_regex/'

Answer 3

In general, this occurs when you supply a string literal when angular is expecting an expression or function. A "#" in the string causes the $parse:lexerr error.

In my case, I was setting a string literal to a custom directive attribute, when I should have been using an expression.

Incorrect:

<my-directive my-attr="/foo#bar"></my-directive>

Correct:

<my-directive my-attr="'/foo#bar'"></my-directive>

In this example, the my-attr attribute was set for two-way binding (=) in the custom my-directive. If it was set to "@" the error would not have occurred.

scope: {
  my-attr: "="
}