2016-07-07 3 views
0

Ionicのアプリをやっています。Ionic AppのAngularJSでデータを表示する際にエラーが発生しました

services.js

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

.factory('Chats', function($http) { 
    // Might use a resource here that returns a JSON array 

    var factory = { 
    chats: null, 
    all: function() { return chats; }, 
    get: function(chatId) { 
     for (var i = 0; i < chats.length; i++) { 
     if (chats[i].id === parseInt(chatId)) { 
      return chats[i]; 
     } 
     } 
     return null; 
    } 
    }; 

    $http.get("http://lucassmuller.com/work/projetoblog/api.php?action=posts").then(function(data) { 
    factory.chats = data; 
    console.log('data ok'); 
    }); 

    return factory; 

}); 

controllers.js

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

.controller('DashCtrl', function($scope) {}) 

.controller('ChatsCtrl', function($scope, Chats) { 
    // With the new view caching in Ionic, Controllers are only called 
    // when they are recreated or on app start, instead of every page change. 
    // To listen for when this page is active (for example, to refresh data), 
    // listen for the $ionicView.enter event: 
    // 
    //$scope.$on('$ionicView.enter', function(e) { 
    //}); 

    $scope.chats = Chats.all(); 
}) 

.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) { 
    $scope.chat = Chats.get($stateParams.chatId); 
}) 

.controller('AccountCtrl', function($scope) { 
    $scope.settings = { 
    enableFriends: true 
    }; 
}); 

しかし、私は実行します。$http.get not working at .factoryで私によって作られた問題の回答に基づいて、私は次のコードを書きましたそれはデータでng-repeatを実行するために、チャットが定義されていないというエラーを表示します。どうすれば修正できますか?

+0

依存モジュールとして 'starter.services'を' starter.controllers'に注入する必要があるかもしれません。 – Iceman

+0

controller.jsファイルで 'angular.module( 'starter.controllers'、['starter.services '])'を実行してください – Iceman

+0

しかし、app.jsで接続されています: 'angular.module( 'starter'、[ –

答えて

1

HTTPリソースへのリクエストはすぐには解決されません。それはpromiseという文字どおりの返事を返します。今は結果が分かりませんが、後で成功するかどうかに関わらず結果を返すでしょう。。約束オブジェクトはプロパティを使用してコントローラ内のプロパティを解決したです。このプロパティはパラメータとして2つの関数、すなわちonSuccessonFailureを取ります。

あなたの場合、これはあなたのやり方です。 $http promisesため

ファクトリー/サービス

.factory('Chats', function($http) { 

    // returning a promise from the service 
    var chats = $http.get("http://lucassmuller.com/work/projetoblog/api.php?action=posts"); 

    var factory = { 
    chats: null, 
    all: function() { return chats; }, 
    get: function(chatId) { 
     for (var i = 0; i < chats.length; i++) { 
     if (chats[i].id === parseInt(chatId)) { 
      return chats[i]; 
     } 
     } 
     return null; 
    } 
    }; 

    return factory; 

}); 

コントローラ

.controller('ChatsCtrl', function($scope, Chats) { 
    // resolving the promise in the controller 
    Chats.all().then(function (res){ // onSuccess, called when response is successfully recieved 
    var chats = res.data 
    console.log(chats); 
    $scope.chats = chats; 
    }, function (err){ // onFailure, called when error response 
     console.log(err); 
    }); 
}) 

チェックアンギュラドキュメント。

関連する問題