UI-Router状态控制器：命名式与内联函数的调用异常排查

这个问题我之前也碰到过，核心根源出在UI-Router v0.4.2的resolve配置写法上！

问题分析 #

你在resolve里写的isOrganization: 'false'或者isOrganization: 'true'，会被Angular当成服务名称去依赖注入容器里查找，而不是直接传递字符串或布尔值。显然不存在名为'false'或'true'的服务，这就导致resolve阶段抛出错误，控制器自然不会被实例化调用。

修复方案 #

把resolve中的静态值改成函数返回的形式，这样Angular就不会把它当作服务查找，而是直接执行函数返回对应的值：

// 修正后的home状态
$stateProvider.state('home', {
  url: '/',
  templateUrl: 'alchemy/home.html',
  controller: 'MainPageCtrl',
  resolve: {
    isOrganization: function() {
      return false; // 返回布尔值，而非字符串
    }
  }
});

// 修正后的organization状态
$stateProvider.state('organization', {
  url: '/package-organization/:page',
  templateUrl: 'alchemy/page.html',
  controller: 'MainPageCtrl',
  resolve: {
    isOrganization: function() {
      return true;
    }
  }
});

额外验证点 #

你的MainPageCtrl依赖注入数组和函数参数的顺序是完全匹配的（['$scope', '$stateParams', 'isOrganization', 'AlchemyPage', ...]），这部分是正确的，不需要调整。

修改后，resolve会正确将布尔值注入到控制器中，控制器就能正常执行$scope.org = isOrganization和AlchemyPage.load($stateParams,$scope)的逻辑了。

内容的提问来源于stack exchange，提问作者Jet