javascript - 调用服务时检索 Controller 中的值并将我们从服务接收到的值返回到 Controller

标签 javascript angularjs node.js angular-services angular-controller

Controller .js

在 contoller.js 中,我有 $scope.data.state,当服务成功时,它应该返回预定的 $scope.data.state 状态,但是当我尝试在服务结束时在 Controller 中放置警报时,我获得与 self 相同的状态并且未预订。我检查了用于执行操作的 WEBAPI,并且预订成功。我只是想知道如何返回一个值。 非常感谢您的帮助。

<小时/>
$scope.data = {};
$scope.data.state = 'self';
$scope.data.starttime = new Date(new Date().getTime()).toLocaleTimeString();
$scope.data.endtime = new Date(new Date().getTime() + 8 * 60 * 60 * 1000).toLocaleTimeString();


myPopup = $ionicPopup.confirm({

    template: ' Enter Start Time <input type="time" id="exampleInput" name="input" ng-model="example.value" placeholder="HH:mm:ss" min="08:00:00" max="23:00:00" required /> <br> Enter End Time <input type="time" id="exampleInput1" name="input1" ng-model="example1.value" placeholder="HH:mm:ss" min="08:00:00" max="23:00:00" required /> ',
    title: 'WS' + settings.label,
    scope: $scope
});


//alert(time1);
NotifyingCache.put('SeatId', settings.label);
NotifyingCache.put('starttime', $scope.data.starttime);
NotifyingCache.put('endtime', $scope.data.endtime);

myPopup.then(function (res) {
    if (res) {
        NotifyingCache.put('starttime',document.getElementById("exampleInput").value);
        NotifyingCache.put('endtime',document.getElementById("exampleInput1").value);

        //alert(time1);
        var booking = {};
        var stat = '';
        booking.SeatId = NotifyingCache.get('SeatId');
        booking.UserId = NotifyingCache.get('UserId');
        booking.StartDate = new Date().toISOString().slice(0, 10);
        booking.EndDate = new Date().toISOString().slice(0, 10);
        booking.StartTime = NotifyingCache.get('starttime');
        booking.EndTime = NotifyingCache.get('endtime');
        BookingService.bookinguser(JSON.stringify(booking)).success(function (data) {
            var infoPopup = $ionicPopup.alert({
                title: 'Success',
                template: 'The desk has been successfully booked for you.'
            });
            $scope.data.state = 'booked';

        }).error(function (data) {

            var alertPopup = $ionicPopup.alert({
                title: 'Booking Failed!!!',
                template: data.Message
            });
            $scope.data.state = 'self';

        });
    } 
<小时/>

服务.js

ServiceModule.service('BookingService', function ($q, $http){

     return{

    bookinguser: function(user){

    //  alert(user);
            var config = {
                headers: {
                    'Content-Type': 'application/json; charset=utf-8'
                }
            }
            var deferred = $q.defer();
            var promise = deferred.promise;
            return $http.post('webAPI', user, config)
             .success(function (data, status, headers, config) {
                 deferred.resolve(data);
                 //return data;
             })
             .error(function (data, status, header, config) {
                 //alert(JSON.stringify(data));
                 var data =  "Data: " + data +
                     "<hr />status: " + status +
                     "<hr />headers: " + header +
                     "<hr />config: " + config;
                     deferred.reject(data);
             });
             promise.success = function (fn) {
                promise.then(fn);
                return promise;
            }
            promise.error = function (fn) {
                promise.then(null, fn);
                return promise;
            }
            return promise;
        }
    }
   });
<小时/>

最佳答案

我将尝试类似的重构,而不尝试代码。当您尝试时可能会发现一些拼写错误或错误。

让我们从服务开始

ServiceModule.service('BookingService', function ($q, $http){

     return {
              bookinguser: bookinguser
            }

    function bookinguser(user){
      var config = {
          headers: {
                    'Content-Type': 'application/json; charset=utf-8'
                    }
          }

          return $http.get('/api/maa')
                      .then(bookinguserComplete)
                      .catch(bookinguserFailed);


          function bookinguserComplete(response) {
              return response.data.results;
          }

          function bookinguserFailed(error) {
              var data =  "Data: " + data +
                "<hr />status: " + status +
                "<hr />headers: " + header +
                "<hr />config: " + config;
              logger.error(data);
          }
    }
});

正如我在评论中告诉你的那样,http 已经返回 promise ,因此你可以直接从 $http.post 返回

正如您在服务中看到的那样,已经有一个 then 和 catch 方法来预先详细说明您的数据,但您仍然返回一个 promise ,因此您必须在 Controller 中解决它

现在是 Controller

.
.
.

booking.EndDate = new Date().toISOString().slice(0, 10);
booking.StartTime = NotifyingCache.get('starttime');
booking.EndTime = NotifyingCache.get('endtime');

BookingService.bookinguser(JSON.stringify(booking)).then(function (data) {
  var infoPopup = $ionicPopup.alert({
        title: 'Success',
        template: 'The desk has been successfully booked for you.'
    });
    $scope.data.state = 'booked';
  }).catch(function (data) {
    var alertPopup = $ionicPopup.alert({
        title: 'Booking Failed!!!',
        template: data.Message
    });
    $scope.data.state = 'self';

  });

现在我真的不知道你的 Controller 做了什么,但尝试使用这个结构并告诉我会发生什么,以便我可以尝试为你提供更多帮助。

附: dataservice的重构不是我的想法,而是直接来自this Angular 样式指南

关于javascript - 调用服务时检索 Controller 中的值并将我们从服务接收到的值返回到 Controller ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37834100/

相关文章:

angularjs - 使用 Ionic/angularjs 打开图片库

ruby-on-rails - 使用 AngularJS 从 Rails Asset Pipeline 显示图像的最佳方法?

json - NPM 警告 "No Repository Field"但我没有存储库

node.js - 附加到 winston 记录的最后一行

javascript - 使用 fp-ts 删除 Either 数组中的重复项

javascript - 执行顺序 - 新对象的函数未定义

javascript - AJAX 内的 PHP 代码到 POST

javascript - Fabric.js 偏移解决方案

javascript - 推送者存在无法使用 angularjs 和 golang 获取成员

node.js - VueFire vs Vue.js + Node.js vs Vue.js + Feathers 优缺点和差异