UI路由器：与现有的控制器集成 [英] ui-router: Integrating with existing controllers

问题描述

我在我的转换当前角度的项目使用的用户界面路由器的过程中，我有点糊涂了。该文件指出添加我控制器这样：

I am in the process of converting my current angular project to use ui-router and I am a little confused. The documentation states I add my controller as such:

$stateProvider.state('contacts.detail', {
   url: '/contacts/:contactId',   
   controller: function($stateParams){
      $stateParams.contactId  //*** Exists! ***//
   }
})

我已经以这种方式定义我的旧控制器：

I have defined my old controller in this manner:

xap.controller('DemoCtrl', [$scope, function ($scope, demoService) {
})

，其中XAP定义为：

where xap is defined as:

var xap = angular.module({ .... })

什么是正确的积分方法？

What is the correct integration method?

感谢

推荐答案

您可以按名称引用pre-注册控制器：

You can refer to a pre-registered controller by name:

$stateProvider.state('contacts.detail', {
    url: '/contacts/:contactId',   
    controller: 'DemoCtrl'
});

您可以添加 $ stateParams 依赖于你的控制器访问参数：

You can add the $stateParams dependency to your controller to access parameters:

xap.controller('DemoCtrl', [
    '$scope',
    '$stateParams',
    'demoService',
    function ($scope, $stateParams, demoService) {
        $stateParams.contactId //*** Exists! ***//
    }
]);

但你也可以内联你的控制器，因此不必拿出唯一的名称为每个控制器的每个州：

But you can also inline your controllers and therefore not have to come up with unique names for each controller for every state:

$stateProvider.state('contacts.detail', {
    url: '/contacts/:contactId',   
    controller: [
        '$scope',
        '$stateParams',
        'demoService',
        function ($scope, $stateParams, demoService) {
            $stateParams.contactId //*** Exists! ***//
        }
    ]
});

这篇关于UI路由器：与现有的控制器集成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！