Question

我的代码中有以下内容：

<a id="navigationQuestionLink"
   ui-sref="question.content({ content: 123 })"
   ui-sref-active="current">
</a>
<a id="navigationAdminLink"
   ui-sref="admin.content({ content: 'overview' })"
   ui-sref-active="current">
</a>

当我点击链接时，元素会获得current类。

但是在我的代码中，当我执行以下操作时：

$state.transitionTo('question.content', { content: testId });

然后它正确转换到状态，URL在浏览器中显示为http://127.0.0.1:17315/question/199，但第一个链接没有获得当前类。这是我正在使用的配置：

var question = {
    name: 'question',
    url: '/question',
    views: {
        'root': {
            templateUrl: function (stateParams) {
                var a = 88;
                return '/Content/app/question/partials/questionHome.html';
            }
        }
    }
};
var questionContent = {
    name: 'question.content',
    parent: 'question',
    url: '/:content',
    views: {
        'root': {
            templateUrl: function (stateParams) {
                var a = 88;
                return '/Content/app/question/partials/questionHome.html';
            }
        }
    }
}

任何人都可以就我可能做错的事情向我提出建议。一切都在功能上工作，除了第一个链接没有得到类当我使用ui-router $state.transitionTo时设置为当前。

Answer 1

您要求的功能 - 应该正常工作，如working plunker所示。

这两个州

  $stateProvider.state({
    name: 'question',
    url: '/question',
    views: {
    ...
  })
  $stateProvider.state({
    name: 'question.content',
    parent: 'question',
    url: '/:content',
    views : {
     ...
  })

有ui-sref：

<a ui-sref-active="current" ui-sref="question">question</a>
<a id="navigationQuestionLink"
   ui-sref="question.content({ content: 123 })"
   ui-sref-active="current">123</a>
<a id="navigationAdminLink"
   ui-sref="question.content({ content: 'overview' })"
   ui-sref-active="current">overview</a>
...
<a ui-sref-active="current" ui-sref="question.content({content: 'next'})">question next</a>
<a ui-sref-active="current" ui-sref="question.content({content: 'other'})">question other</a>

并且这些按钮会将上述标记为expecte：

<button ng-click="go()">question</button>
<button ng-click="gotoContent(123)">question 123</button>
<button ng-click="gotoContent('overview')">question overview</button>
...
<button ng-click="gotoContent('next')">question next</button>
<button ng-click="gotoContent('other')">question other</button>

如果这些是ng-click操作：

$scope.go = function() {
   $state.transitionTo('question');
};
$scope.gotoContent = function(content) {
   $state.transitionTo('question.content', { content: content });
};

使用以上操作方法检查此working example ...

当我使用ui-router $ state.transitionTo时，为什么ui-sref-active =不起作用？

1 个答案: