Самый чистый способ POST с использованием сервиса в Angular?

0

Прямо сейчас у меня есть метод 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;
      });
    };
}]);
Теги:
http

1 ответ

0

Метод запроса рефакторинга на заводскую службу и логику запроса запроса. то есть. SearchService

Таким образом, введите SearchService в MainController и получите доступ к методу запроса службы, который возвращает обещание.

Пример:

app.controller('MainCtrl', ['$scope', 'SearchService', 
  function ($scope, SearchService) {

    $scope.submit = function () {

       var promise = SearchService.getRecipe( $scope.tag );
       ..

    }
  }
]);

Посмотрите на некоторые из руководств по стилю и лучшие практики сообщества, рекомендовал JohnPapa Styleguide.

  • 0
    Пожалуйста, смотрите сообщение для моего рефакторинга кода. Я не мог понять, как передать $ scope.tag на фабрику, чтобы заменить «курицу». Есть ли у вас какие-либо советы по этому поводу?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню