0

我有以下指令，在所有其他情况下都可以正常工作：

.directive('breadcrumbs', function() {
    return {
        restrict: "E",
        replace: true,
        template: '<ul class="breadcrumb offset2" ng-show="breadcrumbs">'
                +'<li ng-repeat="crumb in breadcrumbs">'
                    +'<span ng-hide="crumb[1]">{{crumb[0]}}</span>'
                    +'<a ng-show="crumb[1]" href="#{{crumb[1]}}">{{crumb[0]}}</a>'
                    +'<span ng-show="crumb[1]" class="divider">/</span>'
                +'</li>'
            +'</ul>'
    }
}

它需要一个“面包屑”数组，每个面包屑都是一个包含 的数组['title', 'href']，例如：

$scope.breadcrumbs = [ ['Home', '/'], ['Projects', '/project'], ['Add', ''] ]

如果href为空，则ngShow/ngHide组合以隐藏链接并仅输出文本。

当我想从面包屑中的控制器输出 $scope 变量时，就会出现问题，例如：

var ProjectViewCtrl = function ($scope, $routeParams, Project) {
    $scope.project = Project.get({id: $routeParams.id})
    $scope.breadcrumbs = [ ['Home', '/'], ['Projects', '/project'], ['{{project.name}}', ''] ]
}

目的是{{project.name}}在面包屑的最后一个元素中输出，然后一旦Project.get完成，面包屑与控制器模板中的所有其他内容一起更新。不幸的是，这并没有发生，文本{{project.name}}被输出到页面并且永远不会更新。

我知道另一种方法是在Project.get成功回调中设置面包屑，但这不会真正具有约束力，我只是更新值，因此否定使用 Angular 的主要原因之一:)

4

1 回答 1

1

请参考这个小提琴http://jsfiddle.net/BJP3v/1/。ng-bind用于将动态项目名称绑定到视图。

然后为了测试绑定是否有效，test在控制器范围内创建了一个方法。按下按钮时，项目名称会更新。请将项目名称的更新放在$http调用或$resource调用的回调中

于 2013-04-06T20:07:44.197 回答