Используйте JSON для отображения контента из базы данных

Question

Используйте JSON для отображения контента из базы данных

0

На моем сайте пользователи могут использовать поле ввода, чтобы вставить название фильма в базу данных. Теперь я хочу показать этот заголовок на главной странице веб-сайта.

Я сделал шаблон для показа его,

%div{"ng-repeat" => "movie in movies"}
  {{ movie.title }}

Это контроллер,

angular.module('addMovieseat')

  .controller('movieOverviewCtrl', [
    '$scope', function($scope) {

      $scope.movies = [
        {
          title: 'Star Wars'
        }
      ]

    }
  ]);

И теперь название Star Wars показано на главной странице. Но я не могу понять, как объединить это с моим файлом movies.json, который показывает значения из базы данных.

Я думаю, мне нужно создать сервис и movieOverCtrl эту услугу в movieOverCtrl но я не могу найти пример для этого.

Peter Boomsma 25 авг. 2015, в 13:07

Источник

0

Как вы получаете данные из вашей БД?
Girafa 25 авг. 2015, в 10:15

Теги:

angularjs

json

3 ответа

Ещё вопросы

Как вы получаете данные из вашей БД?

Girafa · Answer 1 · 2015-08-25T08-46-00.000Z

Используйте $ http для получения данных. Присвойте его свойству области видимости на успех. Угловые сделают все остальное.

function getMovies () {
  $http.get('/movies')
    .then(function (response) {
      $scope.movies = response.movies;
    });
}

cubbuk · Answer 2 · 2015-08-25T07-28-00.000Z

Вы можете определить службу, которая извлекает ваш json файл, используя службу $http. Затем вы можете ввести эту службу в свой контроллер, чтобы использовать ваши данные фильма в своих представлениях.

Посмотрите пример:

var app = angular.module('addMovieseat');
app.factory("movieService", function("$http") {
  var movieService = {
    retrieveMovies: function() {
      return $http.get("your-movie-file.json"); // return promise to your json file
    }
  };
  return movieService;
});
app.controller('movieOverviewCtrl', [
  '$scope', '$log', 'movieService'
  function($scope, $log, movieService) {
    function initCtrl() {
      movieService.retrieveMovies().success(function(data, status, headers, config) {
        $scope.movies = data;
      }).
      error(function(data, status, headers, config) {
        // log error
      });
    }
    initCtrl();
  }
]);

Спасибо за пример. Я получаю сообщение об Error: [$injector:unpr] Unknown provider: moviesProvider <- movies <- addMovieCtrl ошибка Error: [$injector:unpr] Unknown provider: moviesProvider <- movies <- addMovieCtrl . Я не уверен, на какие moviesProvider ссылается moviesProvider .
Я забыл вызвать функцию initCtrl, я добавил это сейчас. Эта ошибка возникает, когда вы пытаетесь внедрить службу или данные с именем movies в какой-либо контроллер или другую службу. Angular получает ваши услуги через провайдеров. Поэтому, когда мы объявляем службу с именем movieService, она создает эту службу с помощью movieServiceProvider. Он автоматически добавляет провайдера к имени сервиса и использует этого провайдера для предоставления наших одноэлементных сервисов (они обрабатываются внутренне под углом).
Ошибка, которую я написал ранее, была чем-то, что я закомментировал, моя плохая

Peter Boomsma · Answer 3 · 2015-08-25T09-04-00.000Z

В конце концов я помню, что я сделал что-то подобное в учебнике Codecademy AngularJs.

Контроллер,

angular.module('addMovieseat')

  .controller('movieOverviewCtrl', [
    '$scope', 'movieService', function($scope, movieService) {

      movieService.success(function(data) {
        $scope.movies = data;
      });
    }
  ]);

И serice,

angular.module('addMovieseat')

  .factory('movieService', ['$http', function($http) {
    return $http.get('movies.json')
      .success(function(data) {
        return data;
      })
      .error(function(err) {
        return err;
      });
  }])