无法访问两个控制器上的服务AngularJs

我需要在两个不同的控制器上使用相同的数据，一个是页面，另一个是模态弹出窗口。我创建的服务将执行$ http.get来提取数据。但是，当我将服务应用于Modal Popup时，它会停止加载，甚至数据不会在任何地方加载。无法访问两个控制器上的服务AngularJs

我的服务

(function(){ 
    'use strict'; 
    angular.module('sspUiApp.services') 
    .service('AdUnitService', ['$http', '$rootScope', 'API_URL', function($http, $scope, API_URL) { 
     var data = $http.get('data/selectAdUnits.json'); 

     return { 
     getAdFormats: function() { 
      console.log("inside function"); 
      return data; 
     }, 
     setAdFormats: function(value) { 
     } 
     } 
    }]); 
})();

我都与服务控制器添加。

(function(){ 
    'use strict'; 

    angular.module('sspUiApp.controllers') 
    .controller('AdUnitFormatCtrl', ['$scope', '$state', 'AdUnitService', function ($scope, $state, AdUnitService) { 
     $scope.details = AdUnitService.getAdFormats(); 
    }]) 

    .controller('ModalDemoCtrl', ['AdUnitService', function ($scope, $uibModal, AdUnitService) { 
     $scope.open = function (size) { 
     // $scope.details = AdUnitService.getAdFormats(); 
     $scope.$modalInstance = $uibModal.open({ 
      scope: $scope, 
      templateUrl: 'views/select_ad_format.html', 
      size: size, 
     }); 
     }; 
     $scope.cancel = function() { 
     $scope.$modalInstance.dismiss('cancel'); 
     }; 

     $scope.details = AdUnitService.getAdFormats(); 
     alert($scope.details); 
    }]) 
})();

和HTML

<div id="selectAdFormats" ng-controller="ModalDemoCtrl"> 
    <div class="container"> 
    <div class="ad-format-section"> 
     <div class="row"> 
     <div class="col-lg-3 col-md-3 col-sm-2 col-xs-6 selectedAdFormatData" ng-repeat="frmt in details.adformat"> 
      <div class="row"> 
       <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center"> 
       <img ng-src="../images/{{ frmt.ad_image }}" ng-if="frmt.ad_image"/> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center"> 
       <span class="formatName">{{ frmt.name }}</span> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center"> 
       <span class="resSize">{{ frmt.size }}</span> 
       </div> 
      </div> 
      </div> 
     </div> 
    </div> 
    </div> 
</div>

来源

2016-01-19 Khilen Maniyar

我不相信你正在使用的模式的实例如预期。通过让模态自行打开，你不得不提前使用它的范围。另外，看起来你会喜欢使用'resolve'语法传递依赖关系而不是传入整个'$ scope'的能力。我认为它可以在这种情况下提供帮助，并将调用控制器所需的变量传递给调用控制器，而不是通过服务共享数据。 – tylerwal

angular.module('sspUiApp.services') 
angular.module('sspUiApp.controllers')

你的服务是不同的模块，这就是为什么你不能得到它，如果你声明成同一个模块它应该工作

选项2：

将您的第二个模块sspUiApp.services放入您的sspUiApp.controllers

更新：

var data = $http.get('data/selectAdUnits.json'); 

return { 
    getAdFormats: function() { 
     console.log("inside function"); 
     return data; 
    }, 
    setAdFormats: function(value) {} 
}

的问题是在于数据是asynchronious，你不把它像这样：

$scope.details = AdUnitService.getAdFormats(); 
alert($scope.details);

您尝试提醒承诺，而不是等待它解决并提醒结果，如果你cha它应该工作如下它应该工作：

AdUnitService.getAdFormats().then(function(details) { 
    alert(details);  
});

这种方式角将在执行代码之前等待结果。

约这里角承诺更多信息：https://docs.angularjs.org/api/ng/service/ $ Q

来源

2016-01-19 12:05:31

app.js文件中已经提到了服务和控制器的依赖关系。我正在获取对象对象数据，但它没有在页面上查看。 –

@ user422831我已经更新了我的答案 –

无法访问两个控制器上的服务AngularJs

回答

相关问题