[英]Create controller with service — Get… is not a function
In an ASP.NET Boilerplate project, I have the following code: 在ASP.NET Boilerplate项目中,我有以下代码:
(function () {
appModule.controller('augustinum.views.kostenstelle.index', [
'$scope', '$uibModal', 'abp.services.app.kostenstelle',
function ($scope, kostenstelleService) {
var vm = this;
vm.kostenstellen = [];
vm.getKostenstelle = function () {
kostenstelleService.getKostenstelle().then(function (result) {
vm.kostenstellen = result.items;
console.log("Step1" + vm.kostenstellen.length);
});
};
vm.getKostenstelle();
console.log("Step2" + vm.kostenstellen.length);
}
]);
})();
I have two questions: 我有两个问题:
I get the error: 我收到错误:
getKostenstelle() is not a function. getKostenstelle()不是函数。
If I replace kostenstelleService.getKostenstelle()
with abp.services.app.kostenstelle.getKostenstelle()
the code works — the object list Kostenstelle
is returned. 如果我更换kostenstelleService.getKostenstelle()
与abp.services.app.kostenstelle.getKostenstelle()
的代码工作-对象列表Kostenstelle
返回。 But I think I lost the scope with this workaround, so what is wrong with the kostenstelleService
? 但是我认为我kostenstelleService
通过这种解决方法来解决问题,所以kostenstelleService
怎么了?
If the code works (by replacing kostnestelleService
), I get 2
elements in the array kostenstelle[]
. 如果代码有效(通过替换kostnestelleService
), kostnestelleService
在数组kostenstelle[]
获得2
元素。 At the line with "Step1"
I get the correct number — 2
elements. 在带有"Step1"
的行中,我得到了正确的数字2
元素。 But at the line with "Step2"
, I get 0
elements. 但是在"Step2"
,我得到了0
元素。 Why? 为什么? And how can I change the code, so the line with "Step2"
is executed when the array is filled? 以及如何更改代码,以便在填充数组时执行带有"Step2"
的行?
Many thanks in advance. 提前谢谢了。
1) That's because you forgot to include $uibModal
in here function ($scope, kostenstelleService) {
(line 4). 1)这是因为您忘记在此处的function ($scope, kostenstelleService) {
(第4行)中包括$uibModal
。 Therefore kostenstelleService
points at $uibModal
now. 因此kostenstelleService
在点$uibModal
现在。
Should be: 应该:
appModule.controller('augustinum.views.kostenstelle.index',
['$scope', '$uibModal', 'abp.services.app.kostenstelle',
function ($scope, $uibModal, kostenstelleService) {
2) That's because getKostenstelle()
is an asynchronous operation wrapped in a promise. 2)这是因为getKostenstelle()
是包装在promise中的异步操作。 JavaScript is single threaded, meaning that it goes through each operation one by one and puts async ops in the pending queue so that it doesn't get thread locked. JavaScript是单线程的,这意味着它一步一步地执行每个操作,并将异步操作放在待处理的队列中,这样它就不会被线程锁定。
In your case, what happens is: 您的情况是:
vm.getKostenstelle()
执行vm.getKostenstelle()
kostenstelleService.getKostenstelle()
and put in pending queue 执行kostenstelleService.getKostenstelle()
并放入待处理队列 console.log("Step2" + vm.kostenstellen.length);
执行console.log("Step2" + vm.kostenstellen.length);
vm.kostenstellen.length
is empty because the async call hasn't finished 此时, vm.kostenstellen.length
为空,因为异步调用尚未完成 kostenstelleService.getKostenstelle()
finishes 异步调用kostenstelleService.getKostenstelle()
完成
.then
block is executed; .then
块被执行; vm.kostenstellen
is assigned data and console.log("Step1" + vm.kostenstellen.length);
vm.kostenstellen
被分配了数据和console.log("Step1" + vm.kostenstellen.length);
displays data 显示数据
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.