Angular $http 404 error

Question

I'm receiving a 404 error when trying to send a post request and I'm not sure why. Also getting a 'possibly unhandled rejection' error. I'm quite new to Angular so any tips would be appreciated. I've looked over the documentation and found a variety of other information surrounding the structure of $http.post requests, but so far I can't apply it to what I'm trying to do here:

ng-click from my html file:

<button ng-click="addToFavorites(searchResults.response.data)" class="btn btn-success" type="button" name="addToFavorites">Add to Favorites</button>

Method call in my JS file

addToFavorites: function(movie) {
          var newMovie = isNewMovie(movie); // verify if movie has already been favorited
          if (newMovie) { // add to favoriteMovies if it's a new movie
            console.log(movie);
            // favoriteMovies.push(movie);
            $http.post('/m', movie).then(function(response) {
              console.log(response.data);
            });
            // .then(function(response) {
            //   console.log(response);
            // }).catch(function(err) {
            //   console.log('error:', err);
            // });
          } else { // alert user if it's already been favorited
            alert('This movie is already in your list of favorites.');
          }
        } // end addToFavorites()

Full JS file:

var pmdbApp = angular.module('pmdbApp', []);

pmdbApp.controller('InputController', ['$scope', 'MovieService', function($scope, MovieService) {
  console.log('InputController loaded');
  $scope.title = ''; // data-bound to user input field
  // $scope.searchForm = MovieService.searchForm;
  $scope.searchOMDB = MovieService.searchOMDB; // data-bound to user button click
  // reference to searchResults object
  // object contains the OMDB response as a property
  $scope.searchResults = MovieService.searchResults;
  $scope.getPoster = MovieService.getPoster; // bound to 'Search OMDB' button
  $scope.addToFavorites = MovieService.addToFavorites; // bound to 'Add to Favorites' button
}]); // end 'InputController'

pmdbApp.controller('OutputController', ['$scope', 'MovieService', function($scope, MovieService) {
  console.log('OutputController loaded');
  $scope.movieService = MovieService;
}]); // end 'OutputController'

pmdbApp.factory('MovieService', ['$http', function($http) {
  // searchResults object will be used to store response from the OMDB API
  var searchResults = {};
  /*var searchForm = {
    title: '',
    searchResults: {}
  };*/
  var favoriteMovies = [];

  function isNewMovie(movie) {
    for (var i = 0; i < favoriteMovies.length; i++) {
      if (movie.imdbID === favoriteMovies[i].imdbID) {
        return false;
      }
    }
    return true;
  }

  // var saveToDatabase = function(movie) {
  //   console.log('got here with movie', movie);
  //   $http.post('/movies', movie).then(function(response) {
  //     console.log('response');
  //   });
  // }

  // public information
  return {
    favoriteMovies: favoriteMovies,
    searchResults: searchResults, // pass an object referece
    // searchForm: searchForm,
    searchOMDB: function(title) {
      $http.get('http://www.omdbapi.com/?t=' + title).then(function(response) {
        console.log(response);
        if (response.data.Error) { // alert user if no movie matches search results
          alert('Movie not found!');
        } else { // otherwise store response as an object property
          searchResults.response = response;
        }
      }); // end $http.get
    }, // end searchOMDB()
    addToFavorites: function(movie) {
      var newMovie = isNewMovie(movie); // verify if movie has already been favorited
      if (newMovie) { // add to favoriteMovies if it's a new movie
        console.log(movie);
        // favoriteMovies.push(movie);
        $http.post('/m', movie).then(function(response) {
          console.log(response.data);
        });
        // .then(function(response) {
        //   console.log(response);
        // }).catch(function(err) {
        //   console.log('error:', err);
        // });
      } else { // alert user if it's already been favorited
        alert('This movie is already in your list of favorites.');
      }
    } // end addToFavorites()
  }; // end return
}]); // end 'MovieService'

Answer 1

听起来像是注入问题，您可以确保已将所有依赖项文件注入到应用程序/控制器吗？

Answer 2

I thought it was an error with how I was using Angular, but really it was simply an error in the route setup.

Client post:

    $http.post('/movies', movie).then(function(response) {
      console.log(response.data);
    });

In my main server file:

app.use('/movies', movies);

In my router I HAD:

router.post('/movies', function(req, res) {
  console.log('/movies route hit with movie:', req.body);
  res.send('work, please');
});

When I should have just ' / ' in the router post. Of course the '/movies/movies' route does not exist.