AngularJS 1.6如何在特定路由中执行指定脚本？

嘿，刚接触AngularJS 1.6完全不用慌！针对你说的「特定路由下执行指定脚本」的需求，结合你提到的$state.current.name思路，我给你整理了几种落地的方案，还会解答你可能遇到的疑问~

方法一：全局监听路由切换事件 #

这是最通用的方式，适合需要在多个路由触发脚本，或者想全局统一管理逻辑的场景。

1. 在主控制器或者run块中注入$rootScope和$state，监听路由切换成功的事件：

app.run(function($rootScope, $state) {
  // 监听路由切换完成事件
  $rootScope.$on('$stateChangeSuccess', function(event, toState) {
    // 用$state.current.name或者toState.name判断目标路由
    if (toState.name === 'your.target.route') {
      // 执行你需要的脚本
      alert('Hello World');
      // 也可以放更复杂的逻辑，比如调用服务、加载资源等
    }
  });
});

小提醒：如果你的项目用的是ui-router 1.x+（适配AngularJS 1.6的新版本路由库），官方更推荐用$transitions服务替代旧的事件监听，写法更规范：

app.run(function($transitions) {
  $transitions.onSuccess({}, function(trans) {
    const targetState = trans.to();
    if (targetState.name === 'your.target.route') {
      alert('Hello World');
    }
  });
});

方法二：在路由配置中绑定专属逻辑（推荐） #

这种方式把路由和脚本逻辑直接绑定，更符合AngularJS的设计思路，也更易维护。

1. 定义路由时，给目标路由添加onEnter钩子或者自定义属性：

app.config(function($stateProvider) {
  $stateProvider
    .state('home', {
      url: '/home',
      templateUrl: 'home.html',
      controller: 'HomeCtrl'
    })
    .state('target.route', { // 你的目标路由
      url: '/target',
      templateUrl: 'target.html',
      controller: 'TargetCtrl',
      // 方式A：进入路由时直接执行脚本
      onEnter: function() {
        alert('Hello World');
      },
      // 方式B：自定义属性，配合全局监听（适合复用逻辑的场景）
      data: {
        executeScript: function() {
          alert('Hello World');
        }
      }
    });
});

如果用方式B的自定义data属性，全局监听时可以这样调用：

$rootScope.$on('$stateChangeSuccess', function(event, toState) {
  if (toState.data && toState.data.executeScript) {
    toState.data.executeScript();
  }
});

方法三：直接在对应路由的控制器中执行 #

如果脚本逻辑只和当前路由的业务相关，直接写在控制器里最直观：

app.controller('TargetCtrl', function() {
  // 控制器初始化时自动执行
  alert('Hello World');
  
  // 如果需要延迟执行或者依赖异步数据，也可以用$timeout：
  // $timeout(function() {
  //   alert('Hello World after 1 second');
  // }, 1000);
});

你可能遇到的疑问解答 #

• 为什么有时候$state.current.name拿不到正确值？
  要确保是在路由切换完成后再获取，比如放在$stateChangeSuccess或者$transitions.onSuccess的回调里，不要在控制器初始化时直接调用（此时路由可能还没切换完成）。
• 脚本重复执行怎么办？
  如果用全局监听，要避免重复绑定事件——建议把监听逻辑放在run块里（整个应用只执行一次），或者在控制器销毁时调用$on返回的注销函数解绑事件。

内容的提问来源于stack exchange，提问作者KodeFor.Me