从控制器的功能放置在一个服务和使用这些功能从另一个控制器

我基本上是试图学习如何使用另一个控制器中的功能。控制器之间共享。我有一个控制器内ShopCartCtrl有3种功能（openViewCart，goToCheckout，接近）从控制器的功能放置在一个服务和使用这些功能从另一个控制器

creamShopControllers.controller('ShopCartCtrl', ['$scope', '$state', '$uibModal', 'ngCart', '$http', '$uibModalInstance', 'ShoppingCart', 

    function ShopCartCtrl($scope, $state, $uibModal, ngCart, $http, $uibModalInstance, ShoppingCart) { 
     console.log("Hitting ShopCartCtrl!"); 
     ngCart.setTaxRate(7.5); 
     ngCart.setShipping(2.99); 

     ShoppingCart.openViewCart = function() { 
     $uibModal.open({ 
      templateUrl: 'pages/shopping_cart_modal.html', 
      clickOutsideToClose: true, 
     }) 
     } 

     ShoppingCart.goToCheckout = function() { 
     $state.go('checkout', {}); 
     } 

     ShoppingCart.close = function() { 
     $uibModalInstance.close(); 
     } 

    } 
]);

我有一个服务：

creamShopServices.factory('ShoppingCart', [ 
    function() { 
     return { 
     openViewCart: null, 
     goToCheckout: null, 
     close: null 
     } 
    } 
]);

而且我想打电话给这3个功能叫做IceCreamCtrl

另一个控制器

creamShopControllers.controller('IceCreamCtrl', ['$scope', '$state', 'ShoppingCart', 'IceCream', 'AllIceCreams', 
    function ($scope, $state, ShoppingCart, IceCream, AllIceCreams) { 
     AllIceCreams.get({}, function (result) { 
     console.log("Fetched all ice cream"); 
     $scope.allIceCream = result; 
     }, function (err) { 
     console.log("Error on GET All Ice Cream") 
     }); 

     $scope.viewCart = function(){ 
     ShoppingCart.openViewCart(); //TYPEERROR: ShoppingCart.openViewCart is not a function 
     } 

    } 
]);

但我总是得到ShoppingCart.openViewCart不是一个函数。我想我可能已经错误地设置了一些东西，但我无法弄清楚什么。我如何正确地将第一个控制器的功能设置到服务中，以及如何从第二个控制器正确地调用它？

来源

2017-02-27 truffle

为什么在第一个控制器中定义服务的功能，而不是在服务中定义它们？ –

假设您在ShopCartCtrl中有助手函数或您需要的变量，所以您只希望能够从服务中引用该函数，而不是在服务中定义它。你会怎么做？ – truffle

@RomainVincent不，你不会。 AngularJS服务是单身人士。 –

如果您使用UI路由器，您可以使用子状态和嵌套视图来执行此操作，并且您的子级状态（如果视图嵌套）将从其父级的范围继承。

所以你会有一个控制器，例如你的想法CreamShopCtrl你定义了你希望你的子状态继承的所有方法，然后你可以从你的子状态中调用这些方法。

https://github.com/angular-ui/ui-router/wiki/Nested-States-&-Nested-Views

否则，如果你要坚持你的枪，并使用服务，您应该定义有你的功能的服务，然后分配给你的范围这些功能在您的控制器。

例如：

.controller('ShopCartCtrl', function ($scope, ShoppingCartService) { 
    $scope.openViewCart = ShoppingCartService.openViewCart; 
});

我不知道我是否会推荐这种方法我自己，但它会工作得很好。

来源

2017-02-27 23:33:36

从控制器的功能放置在一个服务和使用这些功能从另一个控制器

回答

相关问题