web-dev-qa-db-ja.com

なぜ$ routeChangeSuccessが呼び出されないのですか?

私のアプリで以下のようなことをしていますが、routeChangeSuccessイベントを取得できません。

var myapp = angular.module('myapp', ["ui.router", "ngRoute"]);

myapp.controller("home.RootController",
  function($rootScope, $scope, $location, $route) {
    $scope.menus = [{ 'name': 'Home ', 'link': '#/home'}, {'name': 'services', 'link': '#/services'} ]

    $scope.$on('$routeChangeSuccess', function(event, current) {

      alert('route changed');
    });

  }
);

myapp.config(
  function($stateProvider, $urlRouterProvider, $routeProvider) {
    $urlRouterProvider.otherwise("/home");
    $stateProvider
      .state('home', {
        url: "/home",
        //template: '<h1>Home Screen</h1>'
        templateUrl: "/Client/Views/Home/Home.htm"
      })
      .state('services', {
        url: "/services",
        //template: '<h1>Service screen</h1>'
        templateUrl: "/Client/Views/Home/service.htm"

      });
  });

以下のような非常に単純なhtmlも失敗します

  <body ng-controller="home.RootController">

    <ul class="nav">
      <li ng-repeat="menu in menus" "="">
        <a href="{{menu.link}}">{{menu.name}}</a>
      </li>
    </ul>
    <div ui-view> No data yet!</div>
  </body>

しかし、リンクをクリックすると、ビューが更新されていることがわかりますが、$ routeChangeSuccesイベントはトリガーされません。

私が欠けているものはありますか?

別の質問私は、ドキュメントなどの追加処理を開始できるように、ビューの準備ができていることを確認するためにフックできるイベントがありました。 ready()。

plnlr ですが、完全には機能していません...

よろしくキラン

18
Kiran

このwikiを確認してください: 状態変更イベント 。抽出物:

  • $ stateChangeSuccess-状態遷移が完了すると発生します。

    $ scope。$ on( '$ stateChangeSuccess'、
    function(event、toState、toParams、fromState、fromParams){...})

したがって、$routeChangeSuccessの代わりに$stateChangeSuccessを使用してください。

利用可能なすべてのイベントに関する詳細情報を取得するには、wiki Events を確認してください。 ここで、あなたにぴったりのイベント$viewContentLoaded...を見つけることができます

42
Radim Köhler

stateChangeイベントは廃止され、削除されました。代わりに transitions を使用してください。

$transitions.onSuccess({}, function () {
    console.log("state changed");
});
0
Ohad Cohen