如何使用NCY-面包屑在抽象父的子状态(How to use ncy-breadcrumb in c

我是新来AngularJS和我用NCY-面包屑我AngularJS项目。 有一个抽象的真实双亲状态与它的两个孩子的状态。 我用这些子国的标签。 但我不能找到一种方法，在面包屑动态显示这些状态。 我能做的唯一的事情是一个硬编码子状态的名字在其他国家的父母。 但我需要一个解决方案，以显示这些孩子的状态collectionsWorkPage动态状态。

.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;
      }
   }
})

Answer 1:

app.config(['$breadcrumbProvider', configNcyBreadcrumb])

function configNcyBreadcrumb($breadcrumbProvider) {
    $breadcrumbProvider.setOptions({
        includeAbstract : true
    });
}

Answer 2:

该parent属性可以是字符串或返回母公司名称的函数。 的函数提供的当前状态控制器（同样用于标签内插）的范围。

所以，你可以这样做：

ncyBreadcrumb: {
  label: 'Edit Collection',
  parent: function($scope) {
    if($scope.tab === 'MY') // Constant defined in CollectionsLibraryMyController
      return 'collectionsLibrary.my';
    else if($scope.tab === 'AVAILABLE') // Constant defined in CollectionsLibraryAvailableController
      return 'collectionsLibrary.available';
  }
}

见API参考更多详细信息

文章来源: How to use ncy-breadcrumb in child state of abstract parent