stateParams support in custom parent

[ncuillery]

stateParams support in custom parent

[ncuillery]

I think you don't use the UI-router well: In your case, the editArticle must be a child of showArticle, then you can benefit of all the features of the UI-router:

.state('showArticle.editArticle', { // the dot defiines a parent/child relation
    ncyBreadcrumb: {
        label: 'Edit article {{ articleName }}',
        parent: // No longer needed
    },
    url: '/edit', // Just the fragment after the parent state's url (no more duplicate) 
    views: {
        '@' : { // target the root view like before if you don't want to rework yours views 
            controller: 'articleEditCtrl',
            templateUrl: 'articleEdit.html'
        }
    }
})

BUT: have a look on #46: it allows url params when specifying ncyBreadcrumb.parent either it is a string or a function.

In your case, something like this should do the job:

.state('editArticle', {
    ncyBreadcrumb: {
        label: 'Edit article {{ articleName }}',
        parent: function ($scope) {
            var param = $scope.slug; // Or wherever is the slug value.
            return 'showArticle({slug: ' + param + '})';
        }
    },
    url: '/article/:slug/edit',
    controller: 'articleEditCtrl',
    templateUrl: 'articleEdit.html'
})

Pending the release, this feature is not yet documented.

I strongly recommend you to use the first solution (UI-router configuration update) :-)

[Wykks]

Oh right, I was aware of parent/child system, but I missed that part :

    views: {
        '@' : { // target the root view like before if you don't want to rework yours views 
            controller: 'articleEditCtrl',
            templateUrl: 'articleEdit.html'
        }
    }

That said, I'll keep in mind the other solution (in case of same parent, from different sources)
Thanks ! 👍

[VierenV]

Hi there,

I am building your first solution @ncuillery but it doesn't keep the scoped variables in the parents.
What I did

   .state('app.enterprises.detailsEnterprise', {
        url: '/:mail',
        views: {
            '@app' : {
                controller: 'enterpriseController',
                templateUrl: 'templates/enterprise.html'
            }
        },
        ncyBreadcrumb: {
          label: '{{client.entreprise}}' //Working great when we are on detailsEnterprise
        },
    })
    .state('app.enterprises.detailsEnterprise.detailsSite', {
        url: '/sites/:id',
        views: {
            '@app' : {
                controller: 'siteController',
                templateUrl: 'templates/site.html'
            }
        },
        ncyBreadcrumb: {
          label: '{{site.lieu.adresse}}' //Working great but we lose client.enterprise
        },
    })

Here I lose the client.enterprise when I move on detailsSite. Is it the expected behavior ?

[MrSpark2591]

This works for me.

.state('editArticle', {
    ncyBreadcrumb: {
    label: 'Edit article {{ articleName }}',
    parent: function ($scope) {
         var param = $scope.slug; // Or wherever is the slug value.
         return 'showArticle({slug:" ' + param + '"})'; // here we need to pass " for making it proper string other wise it will not pass param
       }
    },
    url: '/article/:slug/edit',
    controller: 'articleEditCtrl',
    templateUrl: 'articleEdit.html'
})