AngularJS v1.0.0 指令在 v1.0.7 中不起作用答案

【问题标题】：AngularJS v1.0.0 directive does not work in v1.0.7AngularJS v1.0.0 指令在 v1.0.7 中不起作用
【发布时间】：2013-08-01 15:17:10
【问题描述】：

我使用 angularJS v1.0.0 创建了一个指令，一切正常，现在我将 angular 更新到 v1.0.7，我的指令不再工作，我尝试了许多不同的方法来修复它，但我无法让它工作.

我尝试将 $beginRouteChange 替换为 $routeChangeStart 并将 $afterRouteChange 替换为 $routeChangeSuccess ，但仍然无法正常工作

它只是在应用程序繁忙时显示“正在加载...”消息的文本。您可以在此处查看示例：

http://mhevery.github.io/angular-phonecat/app/#/phones

指令：

working version in AngularJS 1.0.0 but not in v1.0.7

'use strict';

/* Directives */

var directive = {};

directive.butterBar = function($rootScope) {
  return {
    restrict: 'C',
    link: function(scope, element) {
      $rootScope.$on('$beginRouteChange', function() {
        element.addClass('show');
        element.text('Loading...');
      });
      $rootScope.$on('$afterRouteChange', function() {
        element.removeClass('show');
        element.text('');
      });
    }
  };
};

angular.module('phonecatDirectives', []).directive(directive);

谢谢！

【问题讨论】：

标签： angularjs

【解决方案1】：

捕捉路线变化的正确事件是：

$routeChangeStart
$routeChangeSuccess
$routeChangeError
$routeUpdate

见$route Documentation

在您的情况下的用法：

$rootScope.$on('$routeChangeStart', function() {
    element.addClass('show');
    element.text('Loading...');
});
$rootScope.$on('$routeChangeSuccess', function() {
    element.removeClass('show');
    element.text('');
});

【讨论】：

捕捉路线变化是什么意思？和我的问题有什么关系？
你听错了事件，我已经更新了我的答案以适应你的情况。
感谢@Umur 我更改了代码但仍然无法正常工作：directive.butterBar = function($rootScope) { return { restrict: 'C', link: function(scope, element) { $rootScope. $on('$routeChangeStart', function() { element.addClass('show'); element.text('Loading...'); }); $rootScope.$on('$routeChangeSuccess', function() { element.removeClass('show'); element.text(''); }); } }; };

【解决方案2】：

请查看文档：http://docs.angularjs.org/api/ng.$route

不支持$beginRouteChange 和$afterRouteChange。

改为使用$routeChangeStart 和$routeChangeSuccess。

【讨论】：