AngularJS：如何將參數從控制器傳遞到工廠

Question

我有兩個HTML代碼和兩個控制器，我知道可以將數據從工廠傳遞/共享到多個控制器。 第一個html代碼是用戶要填寫的表單。 第二個html代碼是從第一個html代碼獲取數據。

我了解可以通過工廠中的$ http get服務來完成。

我的問題是如何獲取HTML頁面的API或該頁面的控制器的API？

Answer 1

創建服務

angular.module('XYZ').service("XyzService", ["", function() {
  this.data = undefined;    

  this.getData() {
      return this.data; 
  }

  this.setData(dataObject) {
      this.data = dataObject; 
  }
 }]);

//或者，您也可以創建一個工廠。

angular.module('XYZ').factory('XyzFactory', ["", function () {
  const obj = {};
  obj.data = undefined;
  obj.getData = function () {
      return obj.data;
  };
  obj.setData = function (dataObject) {
      obj.data = dataObject;
  };
  return obj; 
}]);

//對於View：HTML-1，Controller：View1Controller

angular.module('XYZ').controller("View1Controller", ["$scope", "XyzService", "XyzFactory", function($scope, XyzService, XyzFactory) {

  // Here you can set data in the XyzService. e.g.
  $scope.dataObject = {
      "firstName" : "John",
      "lastName"  : "Parker"
  };
  // Using service.
  XyzService.setData($scope.dataObject);

  // Using factory
  XyzFactory.setData($scope.dataObject); 
 }]);

對於View：HTML-2，控制器：View2Controller

angular.module('XYZ').controller("View2Controller", ["$scope", "XyzService", "XyzFactory", function($scope, XyzService, XyzFactory) {

  // Here, you can access data Using service.
  console.log("ACCESS DATA : " + XyzService.getData());
  // {"firstName" : "John", "lastName" : "Parker"}

  // Here, you can access data Using factory.
  console.log("ACCESS DATA : " + XyzFactory.getData());
  // {"firstName" : "John", "lastName" : "Parker"}
  }]);

Answer 2

如果您正在使用Angular1.X，那么它很簡單。

請使用此代碼段代碼

由於angularJS是單頁應用程序，因此，您必須在index.html包含該公共服務，並在各自的控制器中包含該公共服務。

app.controller('testController', ['$scope','commonServices',',function($scope,commonServices)

Answer 3

 You have to create service like below and use it in your controller 
 Service code :
    APP(your app name).factory('commonService', function() 
    {
         var storedObject;
            return {
                set: function(o) {
                    this.storedObject = o;
                },
                get: function() {
                    return this.storedObject;
                }
    };
    });

----從Controller調用上述服務-

Answer 4

就是這樣，如果有人感興趣，我想出了另一種方法。 1.將數據發布到數據庫。 在這種情況下，使用的數據庫是“ Firebase”。 2.從數據庫中檢索數據。

區別在於，我不是將數據從一項服務傳遞到另一項服務，而是將數據發布到Firebase並進行檢索。

將數據發布到Firebase的代碼：1.創建服務。

angular.module('firebaserequest', ['firebase'])
.factory('requestService', ['$firebaseArray',
function($firebaseArray){ 
var config = {
apiKey: "",
authDomain: "",
databaseURL: "",
projectId: "",
storageBucket: "",
messagingSenderId: ""
};
if(!firebase.apps.length){
firebase.initializeApp(config);
}

var ref = firebase.database().ref().child("");
var requestArray = $firebaseArray(ref);
return {

add: function(name, date, department, status0, status1, status2, status3, status4) {

  // Transform Date to string

  var requestItem = { 
      Name:name,
      Date:date.toDateString(),
  };
  requestArray.$add(requestItem);

  },

2. 調節器

    .controller('Ctrl', ['$scope', '$stateParams', 'requestService', function ($scope, $stateParams, requestService) { $scope.request = { name:null, date:new Date(), status0:null, status1:null, status2:null, status3:null, status4:null, }; $scope.refreshCreate = function() { $scope.request = { name:null, date:new Date(), }; $scope.$broadcast('scroll.refreshComplete'); } //Function to "create" request & alert $scope.alert = function() { alert(")!" + $scope.request.name ) requestService.add( "", $scope.requestt.name, $scope.requestt.date, "submitted", "pending", "pending", "pending", "pending",); $scope.refreshCreate(); } }]) 

從Firebase檢索數據的代碼：

1. 服務。 （與上述服務相同。）

    getPending: function() { var query = ref.orderByChild("Approval0").equalTo("submitted"); var pendingArray = $firebaseArray(query); return pendingArray.$loaded().then(function() { return pendingArray; }); }, 

2. 調節器

    .controller('Ctrl', ['$scope', '$stateParams', 'requestService', function ($scope, $stateParams, requestService) { $scope.refresh = function(){ requestService.getPending() .then(function(result){ $scope.requestArray = result; }) .finally(function(){ $scope.$broadcast('scroll.refreshComplete'); }); } $scope.refresh(); $scope.getIconClass = function(item) { if (item.Approval4 == "Approved") return "balanced ion-checkmark-circled"; else if (item.Approval1 == "Rejected") return "assertive ion-close-circled"; else if (item.Approval2 == "Rejected") return "assertive ion-close-circled"; else if (item.Approval3 == "Rejected") return "assertive ion-close-circled"; else if (item.Approval4 == "Rejected") return "assertive ion-close-circled"; else return "energized ion-android-stopwatch"; } }])