这是我从其他开发者手中接过的应用程序。我有一个控制器调用服务中的函数,它作为参数传入控制器的$ 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对象确实被分配了正确的数据。
有人可以帮我弄清楚为什么我的观点没有更新吗?
答案 0 :(得分:1)
好的,我从其他开发者那里继承了这个应用程序。 他们在html视图中将控制器定义了两次相同的名称。 arrrrg。因此,未更新的第二组数据位于控制器的第二个实例中。
一旦我移动了一个控制器实例来包装整个视图,问题就全部消失了。
感谢所有帮助过的人。你不可能从我发布的缩略视图代码中说出这一点。 (我还有很多其他的东西需要更新,比如。接下来就像捕获一样,就像Satpal说的那样:只是从我的服务中返回承诺等......)