gpt4 book ai didi

javascript - 对 Angular Provider 的依赖注入(inject)

转载 作者:搜寻专家 更新时间:2023-11-01 04:31:34 25 4
gpt4 key购买 nike

我想知道是否有更简洁的方式注入(inject)提供者。正如我现在所做的那样,我必须让 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 提到:

You should use the Provider recipe only when you want to expose an API for application-wide configuration that must be made before the application starts

从我在你的代码中看到的,大部分功能只能在配置阶段之后使用。您有两个选择要考虑。

[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'
});
});

在运行阶段或在 Controller 中:

.run(function(github) {
github.getUser('ryebalar').then(function(data) {
console.log(data);
});
});

这里有一份指南可以帮助您找到 vendor , developer's guide ,请注意我上面提供的引述来自该指南。

关于javascript - 对 Angular Provider 的依赖注入(inject),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25819353/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com