Angular Js Unexpected marker error Dynamic routes
I am getting several "unexpected tokens <". when i try to create a dynamic route. Normal routes work fine. Therefore, if I set the following route:
.when('/user',{
templateUrl: 'views/user/new',
controller: "addUserCtrl"
})
The request is sent to the server and gets to my express capture of all route handlers, then angular starts and requests the express route api, api / user, binds data, controller and template and I see a nice page. Everything works fine. No mistakes.
If I try to create a dynamic route or a route with greater depth, I get an unexpected marker error when I try to request this route:
.when('/user/:id',{
templateUrl: 'views/user/new',
controller: "addUserCtrl"
})
For example, when I ask for / user / 3, I get an error, and addUserCtrl is never called. Any ideas what might be causing this.
.when('/user/show,{
templateUrl: 'views/user/new',
controller: "addUserCtrl"
})
requesting / user / show will also throw an error. In the console, the error appears next to the request for all angular files (angular.js, App.js, services.js, controllers.js, filters.js, directives.js) that I load into the body of my index.html.
I noticed that this problem occurs whenever I add more than one forward slash to the route. If I try / user / show, I can see the following requests:
/user/show
syntax errors for the below:
/user/js/App.js
/user/js/lib/angular/angular.js
/user/js/filters.js
/user/js/controllers.js'
/user/js/services.js
/user/js/directives.js
If I try / abc / def, I get the following request:
/abc/def
syntax errors for the below:
/abc/js/App.js
/abc/js/lib/angular/angular.js
/abc/js/filters.js
/abc/js/controllers.js'
/abc/js/services.js
/abc/js/directives.js
source to share
I had the same problem and as with atentaten the problem was caused by relative paths to js files. However, this has nothing to do with Express. It can also be caused by relative inclusions of paths from script tags to the head of the html file. So, to clarify, I changed my HTML:
<script src="bower_components/angular/angular.js"></script>
in
<script src="/bower_components/angular/angular.js"></script>
source to share
Apparently this is not an angular issue, but a clear issue.
The problem was that the leading slashes were missing from my angular js include in my index.jade:
script(src='js/lib/angular/angular.js')
script(src='js/App.js')
script(src='js/services.js')
script(src='js/controllers.js')
script(src='js/filters.js')
script(src='js/directives.js')
I changed them to the following:
script(src='/js/lib/angular/angular.js')
script(src='/js/App.js')
script(src='/js/services.js')
script(src='/js/controllers.js')
script(src='/js/filters.js')
script(src='/js/directives.js')
And the mistakes are gone. Even though js loaded without the starting forward slash, it still caused an expression issue, creating a syntax error that probably broke angular, but I don't know exactly why.
source to share
This happens for dynamic ui-router route in angularJS app. I got the same error. solved by changing the path
<script src="app/components/services/campaign.services.js"></script>
to
<script src="/app/components/services/campaign.services.js"></script>
But in my case the path to the index.html file is generated by the gulp task gulp-inject , so I change the gulp-inject config as
inject: { addRootSlash: true }
and it works for me :)
source to share