传递给服务的范围不是更新视图

时间:2017-02-19 00:05:37

标签: angularjs

这是我从其他开发者手中接过的应用程序。我有一个控制器调用服务中的函数,它作为参数传入控制器的$ scope。这与服务中的另一个功能完全相同。

问题是这些服务中只有一个似乎更新了视图。

这是我的代码(非常简洁以保持简短或尽可能简短)

var KrisisEventsApp = angular.module('KrisisEventsApp', []);

KrisisEventsApp.filter('unsafe', function ($sce) { return $sce.trustAsHtml; });

//Controller for registration
KrisisEventsApp.controller('RegistrationCtrl',

    ['$scope', 'RegistrationService', '$timeout',

        function ($scope, RegistrationService, $timeout) {

            $scope.SaveRegistrantData =
            function () {

                //save user input
                RegistrationService.SaveRegistrationForm($scope);

            };

            $scope.Products_Continue =
            function () {

                RegistrationService.ListItemsForCart($scope);
            };

        }

    ]

);
KrisisEventsApp.service('RegistrationService',

    ['$http', function ($http) {

        var thisService = this;

        //injects custom properties into registration form
        thisService.SaveRegistrationForm = function ($scope) {

            this.count = 0;
            this._scope = $scope;

            // if no product are found, go straight to payment page
            this.count = Object.keys($scope.products).length;
            // console.log(this.count);

            $http({

                method: "POST",
                url: v_ModulePath + "/API/Registrants_WebAPI/RegisterUser",
                dataType: 'text/plain',
                data: data,
                headers: {
                    'Content-Type': 'text/plain',
                    'ModuleId': v_servicesFramework.getModuleId(),
                    'TabId': v_servicesFramework.getTabId(),
                    'RequestVerificationToken': v_servicesFramework.getAntiForgeryValue()
                }
            })
              .then(function (response) {

                  data = JSON.parse(JSON.parse(response.data))

                  this.config2 = {
                      method: "GET",
                      url: v_ModulePath + "/API/Registrants_WebAPI/ListItemsForCart?idregistrant=" + $("#hid_registrant_id").val() + "&idevent=" + v_EventID,
                      dataType: 'text/plain',
                      data: '',
                      headers: {
                          'Content-Type': 'text/plain',
                          'ModuleId': v_servicesFramework.getModuleId(),
                          'TabId': v_servicesFramework.getTabId(),
                          'RequestVerificationToken': v_servicesFramework.getAntiForgeryValue()
                      }
                  }

                  return $http.get(v_ModulePath + "/API/Registrants_WebAPI/ListItemsForCart?idregistrant=" + $("#hid_registrant_id").val() + "&idevent=" + v_EventID, this.config2);
              })
              .then(function (response) {
                  data = JSON.parse(JSON.parse(response.data));
                  $scope.Cart = data;
              });
        }


        //list cart items
        thisService.ListItemsForCart = function ($scope) {

            $http(

               {
                   method: "GET",
                   url: v_ModulePath + "/API/Registrants_WebAPI/ListItemsForCart?idregistrant=" + $("#hid_registrant_id").val() + "&idevent=" + v_EventID,
                   dataType: 'text/plain',
                   data: '',
                   headers: {
                       'Content-Type': 'text/plain',
                       'ModuleId': v_servicesFramework.getModuleId(),
                       'TabId': v_servicesFramework.getTabId(),
                       'RequestVerificationToken': v_servicesFramework.getAntiForgeryValue()
                   }
               }).success(function (data) {

                   data = JSON.parse(JSON.parse(data));
                   $scope.Cart = data;

               }).error(function (data) {

               });
        }

    }

    ]

);

以下是视图(部分):

...
<a ng-click="SaveRegistrantData()" class="small button success" id="but_InputForm_MoveNext">Continue</a>

...
<a ng-click="Products_Continue()" class="small button success">Continue</a>

...
<tbody>
    <tr ng-repeat="CartItem in Cart.Cart_Items_List">
        <td>{{ CartItem.Item_Description }}</td>
        <td class="text-right">{{ CartItem.Item_Fee }}</td>
    </tr>
    <tr>
        <td>Total to Pay</td>
        <td class="text-right">{{ Cart.CartTotal }}</td>
    </tr>
</tbody>

您可以看到从控制器调用 SaveRegistrationForm ListItemsForCart 函数,而这些函数又是从视图中按下按钮启动的。

注:

以下几行是每个函数中的重要部分:

data = JSON.parse(JSON.parse(response.data));
$scope.Cart = data;

问题:

只有 ListItemsForCart 更新视图,当我运行 SaveRegistrationForm 功能时,视图不会更新。

我使用fiddler检查web api调用,两个函数都成功返回相同的数据。

我还使用了chrome控制台来确认$ scope.Cart对象确实被分配了正确的数据。

问题:

有人可以帮我弄清楚为什么我的观点没有更新吗?

1 个答案:

答案 0 :(得分:1)

好的,我从其他开发者那里继承了这个应用程序。 他们在html视图中将控制器定义了两次相同的名称。 arrrrg。因此,未更新的第二组数据位于控制器的第二个实例中。

一旦我移动了一个控制器实例来包装整个视图,问题就全部消失了。

感谢所有帮助过的人。你不可能从我发布的缩略视图代码中说出这一点。 (我还有很多其他的东西需要更新,比如。接下来就像捕获一样,就像Satpal说的那样:只是从我的服务中返回承诺等......)