如何在抽象父级的子状态下使用 ncy-breadcrumb [英] How to use ncy-breadcrumb in child state of abstract parent
本文介绍了如何在抽象父级的子状态下使用 ncy-breadcrumb的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我是 AngularJS 的新手,我在我的 AngularJS 项目中使用了 ncy-breadcrumb.有一个抽象的真实父状态和它的两个子状态.我将这些子状态用于选项卡.但是我找不到在面包屑中动态显示这些状态的方法.我唯一能做的就是将一个子州名称硬编码为其他州的父项.但是我需要一个解决方案来动态地在 collectionsWorkPage
状态中显示这些子状态.
I am new to AngularJS and I used ncy-breadcrumb for my AngularJS project. There is an abstract true parent state and two child states of it. I used these child states for tabs. But I couldn't find a way to show these states in the breadcrumb dynamically. The only thing I can do is hardcode one child state name as parent in other state. But I need a solution to display these child states in collectionsWorkPage
state dynamically.
.state('collectionsLibrary', {
url: '/headquarters/collections-library/',
templateUrl: 'app/views/collectionsLibrary/base.html',
controller: 'CollectionsLibraryBaseController',
ncyBreadcrumb: {
label: 'Collections Library',
parent: 'headquarters'
},
abstract: true,
resolve: {
controller: function ($q) {
var deferred = $q.defer();
require(['controllers/collectionsLibrary/CollectionsLibraryBaseController'], function () {
deferred.resolve();
});
return deferred.promise;
}
}
})
.state('collectionsLibrary.available', {
url: 'available/',
templateUrl: 'app/views/collectionsLibrary/available.html',
controller: 'CollectionsLibraryAvailableController',
ncyBreadcrumb: {
label: 'Collections Library-Available',
parent: 'headquarters'
},
resolve: {
controller: function ($q) {
var deferred = $q.defer();
require(['controllers/collectionsLibrary/CollectionsLibraryAvailableController'], function () {
deferred.resolve();
});
return deferred.promise;
}
}
})
.state('collectionsLibrary.my', {
url: 'my/',
templateUrl: 'app/views/collectionsLibrary/my.html',
controller: 'CollectionsLibraryMyController',
ncyBreadcrumb: {
label: 'Collections Library-My',
parent: 'headquarters'
},
resolve: {
controller: function ($q) {
var deferred = $q.defer();
require(['controllers/collectionsLibrary/CollectionsLibraryMyController'], function () {
deferred.resolve();
});
return deferred.promise;
}
}
})
.state('collectionsWorkPage', {
url: '/headquarters/collections-library/:id/edit/',
templateUrl: 'app/views/collectionsWorkPage.html',
controller: 'CollectionsWorkPageController',
ncyBreadcrumb: {
label: 'Edit Collection',
parent: 'collectionsLibrary.available'
},
params: {
data: {}
},
resolve: {
controller: function ($q, $stateParams) {
var deferred = $q.defer($stateParams);
require(['controllers/CollectionsWorkPageController'], function () {
deferred.resolve();
});
return deferred.promise;
}
}
})
推荐答案
app.config(['$breadcrumbProvider', configNcyBreadcrumb])
function configNcyBreadcrumb($breadcrumbProvider) {
$breadcrumbProvider.setOptions({
includeAbstract : true
});
}
这篇关于如何在抽象父级的子状态下使用 ncy-breadcrumb的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文