Прямо сейчас у меня есть метод post, который отлично работает в контроллере, но какой лучший способ реорганизовать это в службу? Самое главное, мне нужно иметь возможность передать $ scope.tag из ng-модели в сообщении. Затем сообщение отправляет сервер на внешний запрос API с использованием параметров post в URL-адресе.
// controller
app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
$scope.submit = function () {
var recipe = $scope.tag;
$http.post('/api', {tag: recipe})
.then(function(response) {
$scope.recipeData = JSON.parse(response.data);
console.log(response.data);
});
};
// server.js
app.post('/api', function (req, res) {
var recipe = req.body.tag;
request("http://externalapi.com/api/search?key=xxx=" + recipe, function (error, response, body) {
res.json(body);
});
});
// index.html
<form class="form-inline" ng-submit="submit()">
<div class="form-group">
<input type="text" ng-model="tag" class="form-control">
<button type="submit" value="Search" class="btn btn-default search-button"> Search</button>
</div>
</form>
---------refactored code----------
app.factory('searchFactory', ['$http', function ($http) {
var obj = {};
obj.fetchRecipes = function () {
return $http.post("/api", { tag: "chicken" });
};
return obj;
}]);
app.controller('MainController', ['$scope', 'searchFactory', function ($scope, searchFactory) {
$scope.submit = function () {
searchFactory.fetchRecipes()
.success(function(response) {
$scope.recipeResults = response;
});
};
}]);
Метод запроса рефакторинга на заводскую службу и логику запроса запроса. то есть. SearchService
Таким образом, введите SearchService в MainController и получите доступ к методу запроса службы, который возвращает обещание.
Пример:
app.controller('MainCtrl', ['$scope', 'SearchService',
function ($scope, SearchService) {
$scope.submit = function () {
var promise = SearchService.getRecipe( $scope.tag );
..
}
}
]);
Посмотрите на некоторые из руководств по стилю и лучшие практики сообщества, рекомендовал JohnPapa Styleguide.