如何在Angular JS中將$ rootScope變量從控制器傳遞到服務

Question

請在下面找到我的代碼示例。

模型中的代碼（HTML代碼）

 <select ng-model="drpDown1" ng-options="option.Title as option.Title for option in drpDown1Options"> <option value="">Select a value..</option> </select> <br/> <select ng-model="drpDown1" ng-options="option.Title as option.Title for option in drpDown2Options"> <option value="">Select a value..</option> </select> 

為了將值綁定到上述dropDown，我在SharePoint 2013 App模型中使用REST API

而且，我有很多這樣的下拉列表。.我必須為每個下拉列表使用相同的代碼，只是列表名稱（用於綁定值的變量）會發生變化。

因此，我想使用服務並將以下代碼放置在名為myService.js的服務中

我正在使用下面的代碼。

  this.bindDropdown = function (listname,dropDownOptionsVar,$rootScope) { debugger; var arr = []; var listName = listname; var scriptbase = hostweburl + "/_layouts/15/"; var requestUrl = appweburl + "/_api/SP.AppContextSite(@target)/Web/Lists/getbytitle('" + listName + "')/items?&@target='" + hostweburl + "'"; var executor = new SP.RequestExecutor(appweburl); executor.executeAsync({ url: requestUrl, method: "GET", headers: { "Accept": "application/json;odata=verbose" }, success: function (data) { var responseData = JSON.parse(data.body); for (var i = 0; i < responseData.d.results.length; i++) { var Title = responseData.d.results[i].Title; var Id = responseData.d.results[i].Id; arr1.push({ ID: Id, Title: Title }); } $rootScope.dropDownOptionsVar = arr; $scope.$apply(); }, error: function (data, errorCode, errorMessage) { alert(errorMessage); } }); } 

我正在從myController.js調用上述myServicve.js函數，如下所示。

myController.js代碼

 $rootScope.drpDown1Options =''; $rootScope.drpDown2Options = ''; mySerivce.bindDropdown("List1",$rootScope.drpDown1Options,$rootScope); mySerivce.bindDropdown("List2",$rootScope.drpDown2Options,$rootScope); 

所以這里的問題是它不能正常工作。.參數$ rootScope.drpDown1Options沒有傳遞給mySerivce.js中的函數

僅當我更改以下語句時，它才能正常工作

$ rootScope.dropDownOptionsVar = arr;

進入

$ rootScope.drpDown1Options = arr;
$ rootScope.drpDown2Options = arr; 在各個函數中分別創建（通過創建一個綁定一個 dropwwon的函數）

Answer 1

創建全局變量

如果您希望使用$rootScope來存儲值，則應在app.js中創建一個運行函數，您可以在其中實例化所有這些值以在整個應用程序中使用。 下面的代碼段

.run(function ($rootScope) {
  $rootScope.variableOne= -1;
  $rootScope.variableTwo= 5;
  $rootScope.variableThree= 50;
}) 

將其放在您的行下' angular.module('star... '

最佳實踐

不應使用全局變量，而應始終使用工廠或服務在控制器之間傳遞數據。 您為數據創建getter和setter，這是getter和setter的基本示例（免責聲明：代碼尚未由我運行）。

.factory('yourFactory', function () {
  var someValue = {};
  return {
    get: function () {
        return someValue;
    },
    set: function(value){
      someValue = value;
    }
  };
})

然后，您可以在需要時實例化此服務並從中獲取數據。 您還可以添加更多詳細信息，例如添加一個int以從存儲的列表或數組中獲取特定值。

Answer 2

我認為您應將響應值聲明為數組后直接將其推入參數數組（有關JavaScript中的參數，請參閱https://stackoverflow.com/a/6605700/1358376 ）

// in controller
$rootScope.drpDown1Options = [];
mySerivce.bindDropdown("List1",$rootScope.drpDown1Options);


// in service
this.bindDropdown = function (listname,dropDownOptionsVar)              
{
    ...
        success: function (data) {
            var responseData = JSON.parse(data.body);
            for (var i = 0; i < responseData.d.results.length; i++) {
                var Title = responseData.d.results[i].Title;
                var Id = responseData.d.results[i].Id;
                dropDownOptionsVar.push({
                    ID: Id,
                    Title: Title
                });
            }
            $scope.$apply();
        },...
    });

}

（順便說一句，您正在將數組推入'arr1'，但聲明/分配了'arr'-這永遠都行不通）

但我也希望使用服務而不是rootScope變量