CODEWITHSUNDEEP
javascriptangularjsangular-ui-routerangular-ui
Aaron Russell
Aaron Russell

Reputation: 75

UI Router parameter URL not working just redirecting to /

I am trying to get UI router to have a detailed message view, here is the code:

  .state('app.messages.detail', {
        url: 'messages/{id}',
        templateUrl: 'templates/views/message.html',
        controller: function($scope, sharedProperties, $stateParams) {
          console.log($stateParams);
          messages = sharedProperties.getMessages();
          $scope.message = messsages.name[$stateParams.id];
    }
  })

Here is the messages array:

var messages = { 
  "Deputy": 
  {
    "name": "Deputy", 
    "message": ["Test", "Whey", "I See you!"]
  },
  "SOCO": 
  {
    "name": "SOCO",
    "message": ["Second Test", "Does this actually work?"]
  }
};

However when I go to /#/messages/Deputy I get redirected to / (There's a redirect to say to go to / if page not found)

Upvotes: 1

Views: 92

Answers (2)

Radim Köhler
Radim Köhler

Reputation: 123861

Would be nice to see the complete picture of the state hierarchy. Because this:

However when I go to /#/messages/Deputy I get redirected to / (There's a redirect to say to go to / if page not found)

could be related to parent state, which (I expect) already defines /messages

// parent
.state('app.messages', {
    url: '/messages',

// child should not repeat the parent's *url* part, it is already there
.state('app.messages.detail', {
    //url: 'messages/{id}',
    url: '/{id}',

Because without that adjustment (using doubled /messages definition) we would need url like this

/#/messages/messages/Deputy

Upvotes: 1

oguzhan00
oguzhan00

Reputation: 509

when you run this code you should see an error like that at the console:

Cannot read property 'Deputy' of undefined

I think true message definition is should be:

$scope.message = messsages[$stateParams.id];

Upvotes: 0

Related Questions