在服务Http请求成功，但不能在视图来显示 [英] Http request in service successful but not able to show in view

问题描述

我用液碱中和的电影数据库的API工作。我写了一个服务，使该回来都好我的http请求。我得到了的console.log但出于某种原因，我仍然无法显示视图中的数据我所有的输出。所以我在想，如果我这样做是错误的，当涉及到2路数据绑定

I am working with Ionic and the api of The Movie Database. I wrote a service to make my http request which comes back all good. I get all my outputs in the console.log but for some reason I am still not able to show the data in the view. So I was wondering if I am doing it wrong when it comes to 2 way databinding

code我的服务：

angular.module('starter.services', [])

.service('HotMoviesService', function($http, $q){
    var final_url = "https://api.themoviedb.org/3/movie/popular?api_key=XXXX";

    var self = {
        'hotMovies' : [],
        'loadHotMovies' : function() {
            var d = $q.defer();
            $http.get(final_url)
            .success(function success (data){
                console.log(data);
                self.hotMovies = data.results;
                d.resolve('The promise has been fulfilled');
            })
            .error(function error (msg){
                console.error("There was an error retrieving the data " , msg);
                d.reject("The promise was not fulfilled");
            });
            return d.promise;
        }
    };
    return self;
});

我controller.js code：

My controller.js code:

angular.module('starter.controllers', ['ionic.contrib.ui.hscrollcards', 'starter.services'])

.controller('StartCtrl', function($scope, $http, HotMoviesService) {

    $scope.hotmovies = [];

    HotMoviesService.loadHotMovies().then(function success (data){
        console.log(data);
        $scope.hotmovies = HotMoviesService.hotmovies;
    },
    function error (data){
        console.log(data)
    });
})

我的HTML code：

My html code:

<ion-view view-title="The Movie Bank">
  <ion-content class="background">

    <h1 class="padding titleStart">Welcome to The Movie Bank</h1>
    <div class="logo"></div>

    <!-- HOT -->
    <a class="customHref" href="#/app/hot">
        <h1 class="padding customH1">Hot</h1>
    </a>

    <hscroller>
        <ion-scroll direction="x" scrollbar-x="false">
            <hcard ng-repeat="hotmovie in hotmovies"> 
                <a href="#/app/hot/{{hotmovie.id}}">
                    <img ng-src="http://image.tmdb.org/t/p/w92/{{hotmovie.poster_path}}" >
                </a>
            </hcard>
        </ion-scroll>
    </hscroller>

  </ion-content>
</ion-view>

下面是我的控制台的截图，你可以看到一切正常：

Here is a screenshot of my console, as you can see everything works fine:

推荐答案

您需要 hotMovies ，记下米的情况：

You need hotMovies, note the "m" case:

$scope.hotmovies = HotMoviesService.hotMovies;

这篇关于在服务Http请求成功，但不能在视图来显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！