我确实自己解决了一段时间，因为没有可用的东西。我决定不使用该
data对象，因为我们实际上不希望面包屑标题由孩子继承。有时会有模态对话框和右侧面板滑入，从技术上讲是“儿童视图”，但它们不应影响面包屑。通过使用
breadcrumb对象，我们可以避免自动继承。
对于实际
title属性，我正在使用
$interpolate。我们可以将面包屑数据与解析范围合并，而不必在其他地方进行解析。在我遇到的所有情况下，我都只想使用resolve作用域，因此效果很好。
我的解决方案也可以处理i18n。
$stateProvider .state('courses', { url: '/courses', template: Templates.viewsContainer(), controller: function(Translation) { Translation.load('courses'); }, breadcrumb: { title: 'COURSES.TITLE' } }) .state('courses.list', { url: "/list", templateUrl: 'app/courses/courses.list.html', resolve: { coursesdata: function(Model) { return Model.getAll('/courses'); } }, controller: 'CoursesController' }) // this child is just a slide-out view to add/edit the selected course. // It should not add to the breadcrumb - it's technically the same screen. .state('courses.list.edit', { url: "/:courseId/edit", templateUrl: 'app/courses/courses.list.edit.html', resolve: { course: function(Model, $stateParams) { return Model.getOne("/courses", $stateParams.courseId); } }, controller: 'CourseFormController' }) // this is a brand new screen, so it should change the breadcrumb .state('courses.detail', { url: '/:courseId', templateUrl: 'app/courses/courses.detail.html', controller: 'CourseDetailController', resolve: { course: function(Model, $stateParams) { return Model.getOne('/courses', $stateParams.courseId); } }, breadcrumb: { title: '{{course.name}}' } }) // lots more screens.我不想将面包屑绑定到指令，因为我认为在我的应用程序中可能有多种方式直观显示面包屑。因此，我将其投入了服务：
.factory("Breadcrumbs", function($state, $translate, $interpolate) { var list = [], title; function getProperty(object, path) { function index(obj, i) { return obj[i]; } return path.split('.').reduce(index, object); } function addBreadcrumb(title, state) { list.push({ title: title, state: state }); } function generateBreadcrumbs(state) { if(angular.isDefined(state.parent)) { generateBreadcrumbs(state.parent); } if(angular.isDefined(state.breadcrumb)) { if(angular.isDefined(state.breadcrumb.title)) { addBreadcrumb($interpolate(state.breadcrumb.title)(state.locals.globals), state.name); } } } function appendTitle(translation, index) { var title = translation; if(index < list.length - 1) { title += ' > '; } return title; } function generateTitle() { title = ''; angular.forEach(list, function(breadcrumb, index) { $translate(breadcrumb.title).then( function(translation) { title += appendTitle(translation, index); }, function(translation) { title += appendTitle(translation, index); } ); }); } return { generate: function() { list = []; generateBreadcrumbs($state.$current); generateTitle(); }, title: function() { return title; }, list: function() { return list; } };})实际的面包屑指令变得非常简单：
.directive("breadcrumbs", function() { return { restrict: 'E', replace: true, priority: 100, templateUrl: 'common/directives/breadcrumbs/breadcrumbs.html' };});和模板：
<h2 translate-cloak> <ul > <li ng-repeat="breadcrumb in Breadcrumbs.list()"> <a ng-if="breadcrumb.state && !$last" ui-sref="{{breadcrumb.state}}">{{breadcrumb.title | translate}}</a> <span ng-show="$last">{{breadcrumb.title | translate}}</span> <span ng-hide="$last" ></span> </li> </ul></h2>从此处的屏幕截图中，您可以看到它在两种导航中均能完美运行：
以及html
<title>标签：
PS到Angular UI Team：请立即添加类似的内容！
