angularjs - Angular and ui-router state children -


i have state:

}).state('sport', {     url: "/:sport",     templateurl: '/app/sports/sport.tpl.html',     controller: 'sportcontroller',     controlleras: 'controller' }); 

and controller looks this:

.controller('sportcontroller', ['$stateparams', function ($stateparams) {     var self = this;      // object hold our parameter     self.slug = $stateparams.sport; }]); 

so, trying pass parameter state. have set this:

.config(['$stateprovider', function ($stateprovider) {      // set our state(s)     $stateprovider.state('sport.designer', {         url: "/designer",         abstract: true,         templateurl: '/app/designer/designer.tpl.html',         controller: 'designercontroller',         controlleras: 'controller'     }).state('sport.designer.team', {         url: "",         templateurl: '/app/designer/team.tpl.html'     }).state('sport.designer.kit', {         url: "/kit",         templateurl: '/app/designer/kit.tpl.html'     }).state('sport.designer.design', {         url: "/design",         templateurl: '/app/designer/design.tpl.html'     }).state('sport.designer.refine', {         url: "/refine",         templateurl: '/app/designer/refine.tpl.html'     }).state('sport.designer.order', {         url: "/order",         templateurl: '/app/designer/order.tpl.html'     }); }]) 

and controller looks this:

.controller('designercontroller', ['$stateparams', 'designerservice', 'httphandler', 'api', function ($stateparams, service, handler, api) {     var self = this;     var slug = $stateparams.sport; // our slug      console.log(slug); }]); 

so, there couple of issues here.

  1. if set link this: ui-sref="sport.designer.team({ sport: controller.slug })" view doesn't move sport state.
  2. the reason using .team because .designer abstract state , team state default state loads

here html sport state:

<a ui-sref="sport.designer.team({ sport: controller.slug })">test</a> 

can see doing wrong?

i got working today. sport state stayed same. changed designer states this:

// set our state(s) $stateprovider.state('designer', {     url: ':sport/designer',     abstract: true,     templateurl: '/app/designer/designer.tpl.html',     controller: 'designercontroller',     controlleras: 'controller' }).state('designer.team', {     url: '',     templateurl: '/app/designer/team.tpl.html' }).state('designer.kit', {     url: '/kit',     templateurl: '/app/designer/kit.tpl.html' }).state('designer.design', {     url: '/design',     templateurl: '/app/designer/design.tpl.html' }).state('designer.refine', {     url: '/refine',     templateurl: '/app/designer/refine.tpl.html' }).state('designer.order', {     url: '/order',     templateurl: '/app/designer/order.tpl.html' }); 

and in sport.tpl.html set link up:

<div class="container">     <div class="row">         <div class="col-md-12">             <h1>{{ controler.slug }}</h1>             <p>this sport homepage.</p>             <p><a ui-sref="designer.team({ sport: controller.slug })">click started</a></p>         </div>     </div> </div> 

and it. designer, did not have child of sport.


Comments

Popular posts from this blog

How to run C# code using mono without Xamarin in Android? -

html - grunt SVG to webfont -

c# - SharpSsh Command Execution -