從服務中獲取AngularJS訪問對象的屬性

Question

我有一個本地配置文件，用於我的AngularJS應用程序。它存儲爲本地JSON文件，並使用服務來獲取其內容。一旦我加載文件的文件，我將它存儲在一個對象中。現在我有一個範圍滑塊，其值也存儲在此配置文件中。但我無法在回調之外訪問對象的屬性。如果我將它記錄在回調之外，記錄該對象的方式爲未定義。最初，我曾經使用過一個角度表達式作爲滑塊元素中的一個屬性，但是會引發一個Angular解析錯誤。我怎樣才能訪問從服務調用它的函數之外的配置屬性？

<div class="col-md-11"> 
    <rzslider rz-slider-model="ageSlider.minValue" 
       rz-slider-high="ageSlider.maxValue" 
       rz-slider-options="ageSlider.options"> 
     </rzslider> 
</div> 

HTML

function getConfigData() { 

    return Service.getConfigData().then(function(data){ 

     $scope.config = data; 
     console.log("Config Data retrieved", $scope.config); 

    }) 

} 
getConfigData(); 

$scope.ageSlider = { 
     minValue: 0, 
     maxValue: 90, 
     options: { 
      floor: 0, 
      ceil: 100, 
      step: 1 
     } 
    }; 

JS：我想使用配置對象的屬性來設置滑塊的最小值和最大值。

function getConfigData() { 
     return $http.get('/static/json/config.json') 
      .then(getConfigDataSuccess); 

     function getConfigDataSuccess(response) { 
      var config = response.data; 

      return config; 
     } 
    } 

服務

Answer 1

updateAgeSlider({}); 
getConfigData(); 

//////////////////////////////////////////////////////////// 

function getConfigData() { 
    ConfigService.get().then(updateAgeSlider); 
} 

function updateAgeSlider (config) { 
    $scope.ageSlider = { 
    minValue: config.options[0].min || 0, 
    maxValue: config.options[0].max || 90, 
    options: { 
     floor: 0, 
     ceil: 100, 
     step: 1 
    } 
    }; 
} 

和服務：

function get() { 
    return $http.get('/static/json/config.json').then(success); 

    function success (response) { 
    return response.data; 
    } 
} 

[編輯]多個滑塊：

updateSliders(); 
getConfigData(); 

//////////////////////////////////////////////////////////// 

function getConfigData() { 
    ConfigService.get().then(updateSliders); 
} 

function updateSliders (configSliders) { 
    configSliders = configSliders || {}; 
    var allSliders = ['ageSlider']; 

    for (var key in myExpectedSliders) { 
    var sliderName = allSliders[key]; 
    $scope[sliderName] = getSliderConfig(configSliders[sliderName]); 
    } 
} 

function getSliderConfig (configSlider) { 
    configSlider = configSlider || {}; 
    return { 
    minValue: configSlider.min || 0, 
    maxValue: configSlider.max || 90, 
    options: { 
     floor: 0, 
     ceil: 100, 
     step: 1 
    } 
    }; 
}