![](/img/trans.png)
[英]How to force update the dependency injection component in Angular: NullInjectorError: No provider for ChangeDetectorRef
[英]Dependency Injection into Angular Provider
我想知道是否有更清潔的方式注入提供者。 正如我現在所做的那樣,我必須擁有http = null,然后在$ get中設置http = $ http,以便我能夠在我的函數中使用它。 以下是我的提供商代碼
CoffeeScript的:
do ->
githubProvider =() ->
http = null
getUser =(username) ->
return http.get("https://api.github.com/users/" + username)
.then (response)->
return response.data
getRepos =(user) ->
return http.get(user.repos_url)
.then (response)->
return response.data
getRepoDetails =(username, repoName) ->
return http.get("https://api.github.com/repos/" + username + "/" + repoName)
.then (response)->
return response.data
getRepoCollaborators =(repo) ->
return http.get(repo.contributors_url)
.then (response)->
return response.data
this.$get =["$http", ($http) ->
http = $http
return {
getUser: getUser,
getRepos: getRepos,
getRepoDetails: getRepoDetails,
getRepoCollaborators: getRepoCollaborators
}]
return
app = angular.module("githubViewer")
app.provider("githubProvider", [githubProvider])
return
JavaScript的:
(function() {
var app, githubProvider;
githubProvider = function() {
var getRepoCollaborators, getRepoDetails, getRepos, getUser, http;
http = null;
getUser = function(username) {
return http.get("https://api.github.com/users/" + username).then(function(response) {
return response.data;
});
};
getRepos = function(user) {
return http.get(user.repos_url).then(function(response) {
return response.data;
});
};
getRepoDetails = function(username, repoName) {
return http.get("https://api.github.com/repos/" + username + "/" + repoName).then(function(response) {
return response.data;
});
};
getRepoCollaborators = function(repo) {
return http.get(repo.contributors_url).then(function(response) {
return response.data;
});
};
this.$get = [
"$http", function($http) {
http = $http;
return {
getUser: getUser,
getRepos: getRepos,
getRepoDetails: getRepoDetails,
getRepoCollaborators: getRepoCollaborators
};
}
];
};
app = angular.module("githubViewer");
app.provider("githubProvider", [githubProvider]);
})();
正如AngularJS Developer's Guide所提到的:
僅當您要為應用程序范圍的配置公開API時才應使用Provider配方,該API必須在應用程序啟動之前進行
從我在代碼中看到的情況來看,大多數功能只能在配置階段之后使用。 您有兩種選擇可供考慮。
[ 1 ]如果您在配置階段沒有需要設置的任何配置,那么考慮如何創建服務而不是提供者。
.service('github', ['$http', function($http) {
this.getUser = function(username) {
return $http.get("https://api.github.com/users/" + username).then(function(response) {
return response.data;
});
};
this.getRepos = function(user) {
return $http.get(user.repos_url).then(function(response) {
return response.data;
});
};
this.getRepoDetails = function(username, repoName) {
return $http.get("https://api.github.com/repos/" + username + "/" + repoName).then(function(response) {
return response.data;
});
};
this.getRepoCollaborators = function(repo) {
return $http.get(repo.contributors_url).then(function(response) {
return response.data;
});
};
}]);
[ 2 ]如果你有任何配置,那么只需復制上面的服務,並在提供者的$get
定義它。
.provider('github', function() {
var configuration = {};
this.setConfiguration = function(configurationParams) {
configuration = configurationParams;
};
this.$get = ['$http', function($http) {
// you can choose to use your configuration here..
this.getUser = function(username) {
return $http.get("https://api.github.com/users/" + username).then(function(response) {
return response.data;
});
};
this.getRepos = function(user) {
return $http.get(user.repos_url).then(function(response) {
return response.data;
});
};
this.getRepoDetails = function(username, repoName) {
return $http.get("https://api.github.com/repos/" + username + "/" + repoName).then(function(response) {
return response.data;
});
};
this.getRepoCollaborators = function(repo) {
return $http.get(repo.contributors_url).then(function(response) {
return response.data;
});
};
}];
});
然后可以在配置階段使用此提供程序,如下所示:
.config(function(githubProvider) {
githubProvider.setConfiguration({
dummyData: 'Dummy Data'
});
});
在運行階段或控制器中:
.run(function(github) {
github.getUser('ryebalar').then(function(data) {
console.log(data);
});
});
以下是幫助您提供者, 開發人員指南的指南 ,請注意我上面提供的報價來自該指南。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.