javascript - AngularJs : Attach a stateParams value to custom data in state objects

Question

我正在按照建议在我的状态对象中定义页面标题 here .

$stateProvider
  .state('project', {
    url: '/projects/:origin/:owner/:name',
    template: '<project></project>',
    data : { pageTitle: 'Project page title'},
  });

这样我以后就可以通过这种方式访问​​它:

$state.current.data.pageTitle

现在...我想做的是，我不想使用固定值作为 pageTitle，而是希望访问 stateParams。

注意，下面的示例不起作用，这是我希望它工作的方式。

$stateProvider
  .state('project', {
    url: '/projects/:origin/:owner/:name',
    template: '<project></project>',
    data : { pageTitle: $stateParams.name},
  });

我还可以使用属性resolve:

resolve: { title: '项目页面标题' },

对于 stateParams 值，我可以这样做:

resolve:{
    pageTitle: ['$stateParams', function($stateParams){
      return $stateParams.name;
    }]
}

然后console.log($state.current.resolve.pageTitle);在我的 Controller 中将返回整个函数而不是结果。

正确的方法是什么？

更新:

我没有提到的是，我使用 AngularJs 和 ES6，并且使用模块化架构。 因此，每个组件都有自己的范围。

你可以查看我之前的post更好地了解我正在使用的模块化架构。

我正在构建一个面包屑来抓取父状态(使用定义的 pageTitle)。 因此在每个模块中定义页面标题名称就完美了。

因此我可以决定页面标题是固定值“我的页面标题”还是 stateParams 值。

也许这是完全错误的，不应该这样做。如果确实如此，请告诉我。

Answer 1

如果您使用像您的示例这样的解析:

resolve:{
    pageTitle: ['$stateParams', function($stateParams){
        return $stateParams.name;
    }]
}

您需要将 pageTitle 注入(inject) Controller :

angular.module('app').controller('controller', [
             'pageTitle',
    function (pageTitle) {

    }
]);

但我不明白这与注入(inject) $stateParams 有什么不同:

angular.module('app').controller('controller', [
             '$stateParams',
    function ($stateParams) {

    }
]);