组件角中的呼叫服务功能

我目前正在使用角度模式，并且一直存在问题。 on alertOnEventClick我打开ComponentModal。在ModalInstanceCtrl和组件我有按钮'好'和'取消'，但我想再添加一个删除预留。不过，我不能在组件中调用UniversalService，因为它没有被定义。我不知道如何定义它。有谁知道一种方式？组件角中的呼叫服务功能

(function() { 
'use strict'; 

angular.module('app').controller('MainController', MainController); 

MainController.$inject = ['$location', 'UniversalService', '$scope', '$sce', '$rootScope','$mdDialog','$cookies', '$window','$compile','uiCalendarConfig','$timeout','$uibModal']; 
function MainController($location, UniversalService, $scope, $sce, $rootScope,$mdDialog,$cookies, $window,$compile,uiCalendarConfig,$timeout,$uibModal) { 

     $scope.alertOnEventClick = function(obj, jsEvent, view){ 

      $scope.openComponentModal(); 
     }; 

     var $ctrl = this; 
     $ctrl.items = ['item1', 'item2', 'item3']; 
     $ctrl.animationsEnabled = true; 

     $scope.openComponentModal = function() { 
     var modalInstance = $uibModal.open({ 
      animation: $ctrl.animationsEnabled, 
      component: 'modalComponent', 
      resolve: { 
      items: function() {debugger; 
       return $rootScope.Info; 
      } 
      } 
     }); 
     modalInstance.result.then(function (selectedItem) { 
      $ctrl.selected = selectedItem; 
     }, function() { 
      console.log("dsfdgb"); 
     }); 
     }; 




}

}）（）;

angular.module('app').controller('ModalInstanceCtrl', function ($uibModalInstance, items,UniversalService) { 
     var $ctrl = this; 
     $ctrl.items = items; 
     $ctrl.selected = { 
     item: $ctrl.items[0] 
     }; 

     $ctrl.ok = function() { 
     $uibModalInstance.close($ctrl.selected.item); 
     }; 

     $ctrl.deleteReservation=function(){ 
      UniversalService.RemoveReservation($ctrl.items.id);debugger; 
     } 

     $ctrl.cancel = function() { 
     $uibModalInstance.dismiss('cancel'); 
     }; 
    }); 


    angular.module('app').component('modalComponent', { 
     templateUrl: 'myModalContent.html', 
     bindings: { 
     resolve: '<', 
     close: '&', 
     dismiss: '&' 
     }, 
     controller: function() { 
     var $ctrl = this; 

     $ctrl.$onInit = function() { 
      $ctrl.items = $ctrl.resolve.items; console.log($ctrl.items);debugger; 
      $ctrl.selected = { 
      item: $ctrl.items[0] 
      };debugger; 
     }; 

     $ctrl.ok = function() { 
      $ctrl.close({$value: $ctrl.selected.item}); 
     }; 

     $ctrl.deleteReservation=function(){ 
      UniversalService.RemoveReservation($ctrl.items.id);debugger; 
     } 

     $ctrl.cancel = function() { 
      $ctrl.dismiss({$value: 'cancel'}); 
     }; 
     } 
    });

来源

2017-07-14 user122222

的原因是，你还没有UniversalService内部组件controller功能，你总是使用它应该在工厂函数内注入任何injectable，这里在这种情况下，你应该在modalComponent注入之前，以确保组件控制器。

代码

angular.module('app').component('modalComponent', { 
    templateUrl: 'myModalContent.html', 
    bindings: { 
    resolve: '<', 
    close: '&', 
    dismiss: '&' 
    }, 
    //injected `UniversalService` inside component controller factory function. 
    controller: ['UniversalService', function (UniversalService) { 
    //all your code as is 
    }] 
}

来源

2017-07-14 11:10:37

你可以让服务像这样：

angular.module('app').service('UniversalService',function(){ 
    function RemoveReservation(){ 
     // Your code 
    } 
});

来源

2017-07-14 11:17:37

组件角中的呼叫服务功能

回答

相关问题