0

angularJS アプリにいくつかのスライダーがあります。私が達成しようとしているのは、ユーザーが選択ドロップダウンのオプションを変更すると、スライダーは RestAPI から新しい値で更新されるはずです。

この例はスライダーの 1 つですが、残りは同じです。

コントローラーにスライダーを作成する

myCtrl.ageSlider = {
            value: 17,
            options: {
                showSelectionBar: true,
                ceil: 38,
                hideLimitLabels: true,
                floor: 17,
                onChange: myCtrl.getResults,
                getPointerColor: function(value) {
                    return '#FFCF00'
                },
                getSelectionBarColor: function(value) {
                    return '#FFCF00'
                }
            }
        };

選択の ng-change で呼び出されるコントローラーの更新関数

myCtrl.updateSliders = function () {

      //other sliders here that don't need a call on API

      StaffServices.getMedic(myCtrl.selected.id,
      function(response) {
        myCtrl.ageSlider.value = parseInt(response.data.age);
        myCtrl.getResults();
      },
      function(response) {
        console.log('Something went wrong on medic process');
      });

    }

そしてgetResults()サービスを呼び出す関数

myCtrl.getResults = function() {
        myCtrl.results = myService.myUpdatesCalc(passSomeValues);
}

ユーザー インターフェイスから手動でスライダーを変更すると、onChange がgetResults関数を起動します。これに何時間も費やし、理由を見つけることができません。何か助けはありますか？

編集：これはgetMedic混乱を避けるためのサービスです

service.getMedic = function(id, onSuccess, onError) {
          $http.get(API_Base + 'api/staff/medic?id='+id,
          {
              headers: { 'Authorization': 'Bearer '+$cookies.get('token')}
          }).
          then(function(response) {

              onSuccess(response);

          }, function(response) {

              onError(response);

          });
      }
4

1 に答える 1

0

Angular$httpの戻り値は約束されているため、値は更新されません。プロミスを処理してから、コールバック関数で更新する必要があります。

myCtrl.getResults = function() {
  myService.myUpdatesCalc(passSomeValues) //this is your REST API, will return a promise
   .then(function(response) { //this is the callback function to handle the successful ajax
    myCtrl.results = response.data; //update your results here!
  }, function(error) { //this is the callback function to handle the failed ajax
    console.log('error')
  })
}
于 2016-12-21T17:32:14.823 に答える