angularjs - $stateChangeSuccess 未在 href-transitioning 上触发

Question

我的结论是否正确，除非我使用 $state.transitionTo，否则 $stateChangeSuccess 不会触发？例如：

//in app config
.state('detail.zoom', {
        url: '/zoom/{itemId}',
        templateUrl: 'detail/zoom-partial.html'
    })

//in html
<a href="#/zoom/{{item.id}}" >ZOOM IT!</a>

//in directive
scope.$state.transitionTo('detail.zoom', { itemId: item.id});

//in some controller
$scope.$on('$stateChangeSuccess', function () {alert('done transitioning!')});

来自 transitionTo 的事件会触发 $stateChangeSuccess，但对于 href 版本而言并非如此。有没有办法为两种类型的转换平等地触发事件？

Answer 1

在我看来，您正在使用嵌套状态。不应该是称为“详细信息”的状态的单独网址。意思是完整的 url 是 url: '/detail/{itemId}/zoom',

Answer 2

尝试 ：

$rootScope.$on('$stateChangeSuccess', function () {
    alert('done transitioning!')
});

Answer 3

从 ui-router 版本 1.0.0 开始，您需要注入

$过渡

服务

并在控制器中使用此方法：

$transitions.onStart({}, function() {});
$transitions.onSuccess({}, function() {});

Answer 4

您可以在之前使用插入符号 ^ 缩短嵌套 URL：

.state('detail.zoom', {
    url: '^/zoom/{itemId}',
    templateUrl: 'detail/zoom-partial.html'
})

<a href="#/zoom/{{item.id}}" >ZOOM IT!</a>

Answer 5

在您的指令中，您可以尝试 scope.$apply()

//in directive
scope.$state.transitionTo('detail.zoom', { itemId: item.id});
scope.$apply();