/ / dane nie są udostępniane pomiędzy Page i modalnym podręcznikiem (pomiędzy kontrolerami) AngularJs - angularjs, usługa, kontroler

dane nie są udostępniane pomiędzy Page i modalnym podręcznym (między kontrolerami) AngularJs - angularjs, usługa, kontroler

Nie mogę udostępniać danych między moją stroną iModalne wyskakujące okienko. Dokładne wymagania. Ładuję dane przez Usługi na mojej modalnej wyskakującej stronie, a wybrane dane na tej Modalnej Popupie powinny być wyświetlane na Stronie, gdy Modal jest zamknięty, zawsze zwracana jest pusta wartość, mimo że dane są pchane.

Kod jest jak poniżej.

(function(){
"use strict";
angular.module("sspUiApp.controllers")
.service("AdUnitService", ["$http", "API_URL", function($http, API_URL) {
var allAdFormats = [];
var selectedAdFormats = [];

$http.get( API_URL + "/ssp/adformat/all")
.then(function onSuccess(response) {
allAdFormats = response.data;
},
function onError(response) {
allAdFormats = [];
});

return {
setSelectedFormats: function(item) {
selectedAdFormats.push(item);
},
getSelectedAdFormats: function() {
return selectedAdFormats;
},
getAdFormats: function() {
return allAdFormats;
}
};
}]);
})();

Mój obaj kontroler

(function(){
"use strict";
angular.module("sspUiApp.controllers")
.controller("AdUnitFormatCtrl", function ($scope, $http, $state, AdUnitService) {
$scope.selectedAdUnit = AdUnitService.getSelectedAdFormats();
})
.controller("ModalDemoCtrl", function ($scope, $http, $state, AdUnitService, $uibModal) {
$scope.allAdFormats = AdUnitService.getAdFormats();
$scope.open = function (size) {
$scope.$modalInstance = $uibModal.open({
scope: $scope,
templateUrl: "views/select_ad_format.html",
size: size,
});
};
$scope.cancel = function () {
$scope.$modalInstance.dismiss("cancel");
};
$scope.add = function (value) {
AdUnitService.setSelectedFormats(value);
};
});
})();

My Modal Html

<div class="ad-format-section" ng-controller="ModalDemoCtrl">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-2 col-xs-6 selectedAdFormatData" ng-repeat="frmt in allAdFormats.adformat">
<div ng-click="add(frmt)">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center">
<img ng-src="/images/../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>

I domyślna strona

<div class="ad-units-section" ng-controller="AdUnitFormatCtrl">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 selectedAdUnitsData" ng-repeat="frmt in selectedAdUnit.adformat">
<div class="col-lg-1 col-md-1 col sm-6 col-xs-12 nopadding"><img ng-src="/images/../images/{{ frmt.ad_image }}" ng-if="frmt.ad_image"/></div>
<div class="nopadding-left col-lg-3 col-md-3 col sm-6 col-xs-12"><span class="formatName">{{ frmt.name }}</span></div>
<div class="col-lg-2 col-md-1 col sm-6 col-xs-12  nopadding-right">
<span class="adType">{{ frmt.type }}</span>
</div>
<div class="col-lg-3 col-md-2 col sm-6 col-xs-12 nopadding">
<span class="floorPrice">{{ frmt.floor_price }}</span>
</div>
<div class="col-lg-1 col-md-5 col sm-6 col-xs-12 nopadding">
<span class="resSize">{{ frmt.size }}</span>
</div>
<div class="col-lg-2 col-md-5 col sm-6 col-xs-12 text-right nopadding">
<span class="spanBtnSetting"><input type="button" value="" class="btn btnSetting watchAd"></span>
<span class="spanBtnSetting"><input type="button" value="" class="btn btnSetting settingAd"></span>
<span class="spanBtnSetting"><input type="button" value="" class="btn btnSetting deleteAd"></span>
</div>
</div>
</div>
</div>

Dzięki.

Odpowiedzi:

0 dla odpowiedzi № 1

Spróbuj użyć fabryki zamiast usługi.

angular.module("sspUiApp.controllers")
.factory("AdUnitService", ["$http", "API_URL", function($http, API_URL) {

W tej chwili masz 2 różne instancjeusługa. Po wstrzyknięciu zależności usługi tworzy nową instancję usługi. Z drugiej strony, fabryki tworzą tę samą instancję po ich wstrzyknięciu. W ten sposób powinieneś być w stanie udostępniać swoje dane pomiędzy 2 kontrolerami.

Usługi Podczas deklarowania serviceName jako argumentu do wstrzykiwania otrzymasz instancję funkcji. Innymi słowy new FunctionYouPassedToService().

Fabryki Podczas deklarowania fabrykiName jako argumentu do wstrzykiwania otrzymasz wartość zwróconą przez wywołanie referencji funkcji przekazanej do module.factory.

Czytaj więcej: AngularJS: Service vs provider vs factory