0

我有一个来自 twitter bootstrap 的标签导航,用于导航我的页面。 在此处输入图像描述

当我单击tournaments视图时不会更新,但 url 现在显示#/tournaments

在此处输入图像描述 在此处输入图像描述

但是,如果我单击 url 栏,然后按 Enter,它会更改视图:

在此处输入图像描述

我已经使用构建文件夹和编译文件夹设置了项目。当项目位于构建文件夹中时,一切正常。然后我使用 grunt 来合并和缩小文件,并将其放入已编译的文件夹中,这就是它开始像这样运行的时候。

r.js用于连接和缩小(我正在使用require.js)并且在此过程中我没有收到任何错误。正如您在我强制刷新浏览器窗口时看到的那样,所有的 html 视图也被正确复制。

就像 angular 对位置的变化没有反应,但是active-tab标题为灰色的 , 被正确地交换了。只是视图不会更新。

有谁知道这可能是什么?

我已将选项卡放在自己的指令中:

define(['angular'], function (ng) {
var directives = ng.module('directives', []);

/* top navigation tabs */
directives.directive('tabset', function () {
    return {
        restrict: 'E',
        scope: {},
        transclude: true,
        replace: true,
        template: '<ul class="nav nav-tabs" ng-transclude></ul>'
    };
})
.directive('tab', ['$location', function ($location) {
    return {
        restrict: 'E',
        replace: true,
        scope: {
            route: '@',
            title: '@'
        },
        link: function (scope, element, attrs) {
            var route = attrs.route;

            scope.location = $location;
            scope.active = false;

            scope.$watch('location.path()', function (new_route) {
                scope.active = route === new_route;
            });
        },
        template: '<li data-ng-class="{active: active}">' +
                    '<a href="#{{route}}">{{title}}</a>' +
                    '</li>'
    };
}]);

return directives;
});

我这样使用它:

<tabset>
    <tab data-route="/home" data-title="Home"></tab>
    <tab data-route="/tournaments" data-title="Tournaments"></tab>
    <tab data-route="/about" data-title="About"></tab>
</tabset>

该问题发生在缩小和连接之后。

编辑:似乎它没有加载所有来源:

build路径中:

在此处输入图像描述

compiled路径中:

在此处输入图像描述

当我单击build路径中的一个链接时,会为我需要的视图发送一个 http GET 请求,但路径中不会发生这种情况compile

.../build/#/...作品。 .../compiled/#/...不起作用。

4

0 回答 0