AngularJS TypeError: "track" is not a function
AngularJS TypeError: "track" is not a function
我正在尝试使用我的控制器方法中的参数调用服务,但我收到一条错误消息,指出它不是一个函数。这是我的代码:
(function (){
angular.module('app.uploadedReleases')
.controller('UploadedReleasesController', UploadedReleasesController)
.controller('ModalController', ModalController);
UploadedReleasesController.$inject = ['$log', '$scope', '$modal', 'ReleaseService', 'TrackService'];
function UploadedReleasesController ($log, $scope, $modal, releaseService, trackService){
vm.selectTrack = selectTrack;
function selectTrack(album, track, index){
trackService.currentTrack(album.slug, track.fileName).then(function(responseValue){
vm.temp = responseValue;
});
vm.formTrack = vm.selected.track;
}
}
这是我的名为 trackService 的服务:
angular.module('app.services')
.service('TrackService', TrackService);
TrackService.$inject = ['$http', '$q'];
function TrackService($http, $q){
var trackService = {};
var releasesUrl = 'http://localhost:8080/api/releases';
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
var trackUrl = releasesUrl + '/'+ releaseSlug + '/' + trackSlug + '/track';
var deferred = $q.defer();
$http.get(trackUrl).then(function(trackResponse){
return deferred.resolve(trackResponse);
}, function(error){
return deferred.reject({msg: 'Error while getting the current track details'})
});
return deferred.promise;
}
}
知道为什么我的控制器会出现错误:TypeError: trackService.currentTrack is not a function
我要说的第一件事是,您正在创建一个服务,那么您应该将方法绑定到 this
上下文,而不是创建对象。
var trackService = {};
将更改为
var trackService = this;
但是 return从服务中获取自定义对象也没有错。所以在目前的情况下你错过了 returned 它。在您的服务代码末尾添加
return trackService
仍然对服务和工厂的工作方式感到困惑,我建议阅读 this answer
您应该 return 来自您以自定义方式创建的 trackService.currentTrack
方法的承诺。
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
var trackUrl = releasesUrl + '/'+ releaseSlug + '/' + trackSlug + '/track';
var deferred = $q.defer();
$http.get(trackUrl).then(function(trackResponse){
return deferred.resolve(trackResponse);
}, function(error){
return deferred.reject({msg: 'Error while getting the current track details'})
});
return deferred.promise; //returned promise
}
相反,你应该做你的自定义承诺,它被认为是反模式来实现你有承诺的地方 return 通过 $http.get
方法,你应该利用它。
重构版本
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
var trackUrl = releasesUrl + '/'+ releaseSlug + '/' + trackSlug + '/track';
return $http.get(trackUrl).then(function(trackResponse){
return trackResponse;
}, function(error){
return {msg: 'Error while getting the current track details'};
});
}
@Pankaj Parkar 的回答是正确的,因为你应该 returning 来自 currentTrack
的承诺,以便在你的控制器中链接 then
。
但是,为了回答有关 TypeError 的问题,您在 TrackService
中混合了工厂和服务语法。
要使其成为工厂,return 公开函数的映射:
function TrackService($http, $q){
var trackService = {};
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
//...
}
return trackService;
}
并用.factory('TrackService', TrackService);
声明。
要使其成为服务,请将公开的功能添加到 this
:
function TrackService($http, $q){
this.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
//...
}
}
并用.service('TrackService', TrackService);
声明。
我正在尝试使用我的控制器方法中的参数调用服务,但我收到一条错误消息,指出它不是一个函数。这是我的代码:
(function (){
angular.module('app.uploadedReleases')
.controller('UploadedReleasesController', UploadedReleasesController)
.controller('ModalController', ModalController);
UploadedReleasesController.$inject = ['$log', '$scope', '$modal', 'ReleaseService', 'TrackService'];
function UploadedReleasesController ($log, $scope, $modal, releaseService, trackService){
vm.selectTrack = selectTrack;
function selectTrack(album, track, index){
trackService.currentTrack(album.slug, track.fileName).then(function(responseValue){
vm.temp = responseValue;
});
vm.formTrack = vm.selected.track;
}
}
这是我的名为 trackService 的服务:
angular.module('app.services')
.service('TrackService', TrackService);
TrackService.$inject = ['$http', '$q'];
function TrackService($http, $q){
var trackService = {};
var releasesUrl = 'http://localhost:8080/api/releases';
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
var trackUrl = releasesUrl + '/'+ releaseSlug + '/' + trackSlug + '/track';
var deferred = $q.defer();
$http.get(trackUrl).then(function(trackResponse){
return deferred.resolve(trackResponse);
}, function(error){
return deferred.reject({msg: 'Error while getting the current track details'})
});
return deferred.promise;
}
}
知道为什么我的控制器会出现错误:TypeError: trackService.currentTrack is not a function
我要说的第一件事是,您正在创建一个服务,那么您应该将方法绑定到 this
上下文,而不是创建对象。
var trackService = {};
将更改为
var trackService = this;
但是 return从服务中获取自定义对象也没有错。所以在目前的情况下你错过了 returned 它。在您的服务代码末尾添加
return trackService
仍然对服务和工厂的工作方式感到困惑,我建议阅读 this answer
您应该 return 来自您以自定义方式创建的 trackService.currentTrack
方法的承诺。
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
var trackUrl = releasesUrl + '/'+ releaseSlug + '/' + trackSlug + '/track';
var deferred = $q.defer();
$http.get(trackUrl).then(function(trackResponse){
return deferred.resolve(trackResponse);
}, function(error){
return deferred.reject({msg: 'Error while getting the current track details'})
});
return deferred.promise; //returned promise
}
相反,你应该做你的自定义承诺,它被认为是反模式来实现你有承诺的地方 return 通过 $http.get
方法,你应该利用它。
重构版本
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
var trackUrl = releasesUrl + '/'+ releaseSlug + '/' + trackSlug + '/track';
return $http.get(trackUrl).then(function(trackResponse){
return trackResponse;
}, function(error){
return {msg: 'Error while getting the current track details'};
});
}
@Pankaj Parkar 的回答是正确的,因为你应该 returning 来自 currentTrack
的承诺,以便在你的控制器中链接 then
。
但是,为了回答有关 TypeError 的问题,您在 TrackService
中混合了工厂和服务语法。
要使其成为工厂,return 公开函数的映射:
function TrackService($http, $q){
var trackService = {};
trackService.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
//...
}
return trackService;
}
并用.factory('TrackService', TrackService);
声明。
要使其成为服务,请将公开的功能添加到 this
:
function TrackService($http, $q){
this.currentTrack = currentTrack;
function currentTrack(releaseSlug, trackSlug){
//...
}
}
并用.service('TrackService', TrackService);
声明。