AngularJs UI Router URL-Formatierung

Question

Ich verwende angularjs-ui router Modul für die Verwaltung meiner Staaten.

Ich habe diese Struktur:

$stateProvider.state('menu', { 
     templateUrl: '/templates/menu/wrap.html', 
     params: { 
      slug: { 
       value: '' 
      }, 
      id: { 
       value: null 
      } 
     }, 
     ncyBreadcrumb: { 
      label: 'Menu' 
     } 

    }).state('menu.list', { 
     url: '/:slug', 
     parent: 'menu', 
     params: { 
      slug: { 
       value: '' 
      }, 
      id: { 
       value: null 
      }, 
      Name: { 
       value: '{{Name}}' 
      }, 
      Type: { 
       value: null 
      } 
     }, 

     views: { 
      // the main template will be placed here (relatively named) 
      '': { 
       templateUrl: '/templates/menu/main.html', 
       controller: 'MenuMainCtrl as MNC' 
      }, 

      // for column two, we'll define a separate controller 
      'productList@menu.list': { 
       templateUrl: '/templates/menu/productlist.html', 
       controller: 'ProductListCtrl as PLC' 
      }, 
      // for column two, we'll define a separate controller 
      'navigation@menu.list': { 
       templateUrl: '/templates/menu/navigation.html', 
       controller: 'MenuNavigationCtrl as MN' 
      }, 
      // for column two, we'll define a separate controller 
      'cart@menu.list': { 
       templateUrl: '/templates/menu/cart.html', 
       controller: 'CartCtrl as CC' 
      } 
     }, 
     ncyBreadcrumb: { 
      label: '{{Name}}' 
     } 
    }).state('menu.detail', { 
      parent: 'menu.list', 
      url: '/:productSlug', 
      params: { 
       productID: { 
        value: "" 
       }, 
       productSlug: { 
        value: "" 
       }, 
       productName: { 
        value: "" 
       }, 
       Name: { 
        value: "Breakfast" 
       }, 
       Type: { 
        value: null 
       }, 
       MenuListItemID: { 
        value: null 
       } 

      }, 
      views: { 
       '@': { 
        templateUrl: '/templates/menu/productSingle.html', 
        controller: 'ProductSingleCtrl as PSC' 
       } 
      }, 

      ncyBreadcrumb: { 
       label: '{{productName}}' 
      } 

     }); 

Siehe den letzten Zustand namens "menu.detail". Basis-URL dafür ist "/ menu /" und wenn dieser Status aktiv ist, ist meine URL zB. "localhost: 8081/Menü/Frühstück-Sandwiches/farmtotable-Frühstück-Sandwiches" aber mein Kunde möchte "localhost: 8081/Produkt/farmtotable-Frühstück-Sandwiches" sein.

Ist das überhaupt möglich und wenn, können Sie mir dabei helfen?

Answer 1

können Sie überschreiben die Eltern-URL die folgende Art und Weise:

.state('menu.detail', { 
    parent: 'menu.list', 
    url: '^/product/:productSlug', 
    params: { 
     productID: { 
      value: "" 
     }, 
     productSlug: { 
      value: "" 
     }, 
     productName: { 
      value: "" 
     }, 
     Name: { 
      value: "Breakfast" 
     }, 
     Type: { 
      value: null 
     }, 
     MenuListItemID: { 
      value: null 
     } 

    }, 
    views: { 
     '@': { 
      templateUrl: '/templates/menu/productSingle.html', 
      controller: 'ProductSingleCtrl as PSC' 
     } 
    }, 

    ncyBreadcrumb: { 
     label: '{{productName}}' 
    } 

});