ng-init not working angularjs

Question

I am getting parse error

Syntax Error: Token '{' is an unexpected token at column 8 of the expression [user= ${user}] starting at [{user}].

home.html

 <body ng-controller="mainCtrl" ng-init="user= ${user}">

Referring this example ,I am sending model to angularjs Getting data from Spring MVC in Angular JS in the initial view call.

controller.js

angular.module('userSystem', [ 'ngRoute' ]).config(

  function($routeProvider, $httpProvider) {

    $routeProvider.when('/', {
      templateUrl : 'home.html',
      controller : 'home'
    }).when('/login', {
      templateUrl : 'login.html',
      controller : 'navigation'
    }).otherwise('/');

}).controller('mainCtrl',
    function($rootScope, $scope, $http, $location, $route) {
})
});

Spring Controller

@RequestMapping(value = "/", method = RequestMethod.GET)
   public  String getIndex(Model model)
   {
     model.addAttribute("user","user");
     return "home";

   }

Please let me know what is wrong here and how to fix it. Thanks

Thanks for updating. It appears you're declaring your controller incorrectly, it should look something like this .controller('mainCtrl', ["$rootScope", "$scope", "$http", "$location", "$route", function($rootScope, $scope, $http, $location, $route) {}]); <- here I'm passing the names of the function dependencies in the array as preceeding elements. — Phil
– Phil, Commented May 9, 2016 at 13:30

alxpez · Accepted Answer · 2016-06-08 11:27:29Z

1

Try changing your controller, so instead of sending just a String with the view name, you send a ModelAndView object:

@RequestMapping(value = "/", method = RequestMethod.GET)
public ModelAndView getIndex() {

    ModelAndView mv = new ModelAndView("home");
    mv.addObject("user", "USER_NAME");
    return mv;
}

On the other hand, are you using any templating framework (thymeleaf, velocity...)? Cause in that case, your problem may be in how you pick up the model attribute in front-end.

EDIT (as an answer to the templating framework question):

In case you're using thymeleaf, you would need to do something like this in your index.hmtl:

<body ng-controller="mainCtrl as main" data-th-attr="ng-init='main.user=\''+${user}+'\''>

I found myself with this problem in the past.

edited Jun 8, 2016 at 11:27

answered Jun 8, 2016 at 9:38

alxpez

1511 gold badge2 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

alxpez Over a year ago

Also as a good practice, notice that I setted an alias to the controller to aboid unwanted scope problems in your front-end app. Also it's more clear what is what

Phil · Accepted Answer · 2016-05-09 13:38:11Z

0

If you remove the curley braces around user and change to this it will remove your syntax error for you:

<body ng-controller="mainCtrl" ng-init="user= $user">

Taken that you're spring code and population of $user is working correctly.

answered May 9, 2016 at 13:38

Phil

3,7663 gold badges36 silver badges42 bronze badges

4 Comments

Saurabh Over a year ago

On removing braces,user value is undefined

Phil Over a year ago

You'll need to add $user as a dependency to mainCtrl

Saurabh Over a year ago

I cannot add dependency as $user, as user is neither service nor controller

Phil Over a year ago

I'm not familiar with spring so I'm not sure what it's doing, it looks like you're setting the user attribute on the model to the string "user". Is this supposed to be a string? Also, how are you accessing the user attribute on the model from JavaScript?

Saurabh · Accepted Answer · 2016-06-08 12:38:56Z

0

I had used resolve from angularjs to populate with user details.

$routeProvider.when('/', {
      templateUrl : 'home.html',
      controller : 'home',
      resolve: {
        message: function(messageService){
            var promise= messageService.getMessage();
            promise.then(data){
            allConstants.user=data;
            }
            return promise;
        }
    }
    }).when('/login', {
      templateUrl : 'login.html',
      controller : 'navigation'
    }).otherwise('/');

Here allConstants is a varible accessible by entire application controllers

answered Jun 8, 2016 at 12:38

Saurabh

7,8934 gold badges50 silver badges46 bronze badges

Collectives™ on Stack Overflow

ng-init not working angularjs

3 Answers 3

1 Comment

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related