angularjs如何在同一模块的2个单独页面上路由2个单独的控制器答案

【问题标题】：angularjs how to route 2 separate controllers on 2 separate pages for same moduleangularjs如何在同一模块的2个单独页面上路由2个单独的控制器
【发布时间】：2016-03-04 16:05:48
【问题描述】：

我有一个包含模块、路由、工厂和控制器的主页。下面是第一页，然后我粘贴到了第二页。

var myApp = angular.module('myApp', ['angularjs-dropdown-multiselect', 'myModule', 'ngMaterial',  'ui.router', 'angularMoment', 'breeze.directives', 'breeze.angular', 'ui.bootstrap.pagination']).run(['breeze', function (breeze) { }]);;
myApp.config(function ($stateProvider, $urlRouterProvider, $httpProvider) {
    $urlRouterProvider.otherwise("/Ordering");
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];

    $stateProvider       
        .state('Ordering', {
            url: '/Ordering',
            templateUrl: '/App/js/Ordering/Ordering.html'
        })
    .state('OrderingDetails', {
        url: '/OrderingDetails',
        templateUrl: '/App/js/Ordering/partials/OrderingDetails.html',
        controller: 'QtyUsedDetailsCtrl',
        resolve: {
            fromDate: function ($stateParams) {    
                return $stateParams.fromDate;
            },
        }
    })

});

myApp.config(function ($mdThemingProvider) {
    $mdThemingProvider.theme('default')
      .primaryPalette('blue-grey');
})

.controller('AppCtrl', ['$scope', '$mdSidenav', function ($scope, $mdSidenav) {
    $scope.toggleSidenav = function (menuId) {
        if ($scope.lockedOpen) {
            $scope.lockedOpen = "";
        }
        else {
            $scope.lockedOpen = "md-locked-open";
        }
    };

}])

.controller('OrderingListCtrl', [
    '$scope','$http', '$q', '$filter', '$location', '$window','$state','$stateParams', 'mydatacontext', 'breeze', 'OrderingService',
    function ($scope, $http, $q, $filter, $location, $window, $state, $stateParams, mydatacontext, breeze, OrderingService) {
    }
])

.factory('OrderingService', ['$http','mydatacontext', function ( $http, mydatacontext) {

    function loadDetails(filter) {
        console.log(breeze);

        return $http({
            method: 'GET',
            url: '/FabuServices/Status',
            params: { fromDate: filter.fromDate)
        }).then(function (result)
        { return result.data; })
    };  

}]);

这是我的第二页，我的第一页似乎无法识别工厂。

'use strict'

angular.module('myApp')

.controller('QtyUsedDetailsCtrl', ['$scope', 'OrderingService', '$stateParams',
function QtyUsedDetailsCtrl($scope, OrderingService, $stateParams) {

    $scope.details = [];
    $scope.test1 = orderingService.test;


    $scope.init = function () {

        $scope.test = OrderingService.test;

        OrderingService.loadDetails($stateParams.fromDate)
       // orderingService.loadDetails('','','')
        .then(function (data) {
            console.log(data);
            $scope.details = data;
        });
    };

    $scope.init();



}]);

好的。所以我相信我已经把它缩小到问题只是服务/工厂。当我调用它时，它会破坏一切。

-------------编辑！好的，是的，服务很有帮助，但实际问题非常愚蠢。我忘记将功能添加到我的服务返回中！！！！现在有人可以发布答案而不是对剩余问题的评论吗？下一页上的 $stateParams 不是未定义的。在控制台中显示对象（但不是可扩展对象，并且没有属于该对象的详细信息）。并且 $stateParams 的“属性”变量是未定义的。您可以在我的原始帖子中看到代码（在此编辑上方）。

【问题讨论】：

您在第一个 state 对象中缺少 controller: 'QtyUsedDetailsCtrl',
为什么必须进入第一个状态。该网址根本不使用该控制器。
我唯一注意到的是我没有为 QtyUsedDetailsCtrl 提供任何“路径”。有必要吗？我该怎么做？
对不起，我误解了这个问题
我想您首先将url: '/OrderingDetails', 更改为url: '/OrderingDetails/{fromDate:string}', 并删除resolve 部分，只需使用$stateParams 直接从控制器中获取参数

标签： angularjs angularjs-routing

【解决方案1】：

答案是您必须将其包含在 url: 中才能让 $stateparams 了解它。
--我知道可能还有另一种使用参数的选项：在 url 之后并像这样传递它，但我无法让我的工作。这样做的好处是网址很好！ --另一个我必须创建一个formatdate函数来绕过的问题是，当我发送日期对象时，角度或js不喜欢，所以我必须解析它们，如你所见......

这是我更新的代码：

 .state('orderingDetails', {
        // url: '/orderingDetails:fromDate/:toDate',
        url: '/purchasingDetails/{fromDate}/{toDate}',
        templateUrl: '/App/js/ordering/partials/OrderingDetails.html',
        controller: 'QtyUsedDetailsCtrl',
        resolve: {
            details: function (OrderingService, $stateParams) {        
                return OrderingService.loadDetails($stateParams.fromDate,$stateParams.toDate);

这是我的 $state.go 调用：

 $scope.openDetail = function (index) {
        var url = $state.href('orderingingDetails', { fromDate: $scope.formatDate($scope.filter.fromDate) , toDate: $scope.formatDate($scope.filter.toDate)} );            
        window.open(url, '_blank');    
    };

【讨论】：