AngularJS 1.5中的組件不監聽來自$ scope的廣播事件

Question

我遇到了這個問題，無法真正解決該問題。 我有這個組成部分：

    (function () {
    'use strict';

    // Usage:
    // 
    // Creates:
    // 

    myApp
        .component('navbar', {
            //template:'htmlTemplate',
            templateUrl: 'app/components/navbar/navbar.partial.html',
            controller: ControllerController,
            bindings: {
                progress: '<'
            },
        });

    ControllerController.$inject = ['$scope','$rootScope','changeState'];
    function ControllerController($scope,$rootScope,changeState) {

        var $ctrl = this;

        $scope.$on('state-changed',function(event,args){
            console.log(args);
        });




        $ctrl.$onInit = function () { };
        $ctrl.$onChanges = function (changesObj) { };
        $ctrl.$onDestory = function () { };
    }
})();

事件“狀態更改”在$ transitions.onSuccess（UI路由器1.0 Beta）上觸發。 這里的代碼：

var myApp = angular.module('myApp', ['ui.router']);

myApp.controller('appCtrl', ['$scope', '$state', 'formDataService', '$timeout', '$transitions','changeState','$transitions',
        function ($scope, $state, formDataService, $timeout, $transitions,changeState,$transitions) {

        changeState.go('1');
        $scope.stateByFar = 1;

        $scope.currentState = function(){
            return $state.current.name;
        };

        $scope.updateStateByFar = function(){
            if (parseInt($scope.currentState())>$scope.stateByFar)
                $scope.stateByFar=parseInt($scope.currentState());
        };



            $transitions.onSuccess({to: '*'}, function(){

                $scope.updateStateByFar();
                console.log($scope.stateByFar);
                $scope.$broadcast('state-changed',{currentState: $scope.currentState(),
                                                    stateByFar : $scope.stateByFar});

            }
            );




    }]);

[編輯]廣播實際上有效。 無法在第一個狀態播放。 當主模塊運行時，第一條指令是：$ state.go（'1'）; 而且我無法檢測到第一個state.go。 進一步收聽state.go。

Answer 1

我不確定您是否遇到類似於我的問題，在這種情況下，希望我的發現對您有所幫助。 我的問題的完整描述以及找到的解決方案在這里 。

簡而言之，在使用$transitions遇到了一些問題，我發現在1.0.0.beta1版本中， to和from參數不起作用。

所以，代替

$transitions.onSuccess({to: '*', form: '*'}, function(){});

我正在使用

$transitions.onSuccess({}, function(){
    if($state.current.name == 'myState') // do stuff
});

Answer 2

我將指出四件事：

1） '*'是一種全局模式，它與根級別的任何狀態匹配，但與子狀態不匹配。 也使用雙星號'**'來匹配子狀態。 ui-router glob文檔很分散，不好，抱歉。

更好的是，默認值為：條件已經匹配任何狀態，因此請使用onSuccess({}, ...) 。

這在這里記錄https://ui-router.github.io/docs/latest/interfaces/transition.hookmatchcriteria.html

所有屬性都是可選的。 如果省略任何屬性，則將其替換為值true，並且始終匹配。

2）如果在控制器中創建鈎子，則在銷毀控制器作用域時應注銷該鈎子。

var deregisterFn = $transitions.onBefore(...)
$scope.$on('$destroy', deregisterFn);

3）如果在初始化控制器之前（以及在onSuccess掛鈎寄存器之前）正在進行轉換，則不會捕獲初始轉換。 您可以從$state.transition && $state.transition.promise正在進行的過渡承諾。

4）舊的$stateChange*事件仍然可用，但是您必須選擇加入。 參見https://ui-router.github.io/docs/latest/modules/ng1_state_events.html

有關遷移到1.0的更多信息，請參閱此指南： https : //ui-router.github.io/guide/ng1/migrate-to-1_0