2016-04-15 18 views
3

私はionicに新しいです。私は休憩の呼び出しで正常にユーザーリストを入力しました。 $ httpメソッドを使用して特定のユーザーにデータを取得したいとします。私はそれを行うことができません。私のコードはあります。

service.js

angular.module('starter.service',[]). 
    factory('Contents',['$http',function($http){ 
    var users = []; 

    return { 
     get: function(){ 
     return $http.get("http://jsonplaceholder.typicode.com/users").then(function(response){ 
      users = response; 
      return users; 
     }); 
     }, 
     remove:function(content){ 
     users.splice(users.indexOf(content),1); 
     }, 
     getUser:function(chatId) 
     { 
     console.log('inside service'); 
     for(var i=0; i<users.length;i++){ 
      if(users[i].id === parseInt(chatId)){ 
      return users[i]; 

      } 
     } 
     return null; 
     } 
    } 
    }]); 

controller.js

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


    .controller('ChatCtrl', function($scope, Contents,$ionicModal) { 
    console.log('inside controller'); 
    Contents.get().then(function(users){ 
     //users is an array of user objects 
     $scope.contents=users.data; 
     console.log($scope.contents); 
    }); 
     $scope.remove = function(content) { 
     Contents.remove(content); 

    }; 

    }) 
    .controller('ChatDetailCtrl', function($scope, $stateParams, Contents) { 
    console.log('details'); 



$scope.content = Contents.getUser($stateParams.chatId); 

    console.log($stateParams.chatId); 
    console.log($scope.content) 
}); 

chat.html:

<ion-view view-title="Chats"> 

    <ion-content> 
    <ion-list> 
     <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="content in contents" type="item-text-wrap" > 
      <img ng-src="{{content.image}}" style="width:50px; height:50px;" ng-click="showUser(content)"> 
     <a href="#/tab/chats/{{content.id}}" class="subdued"> 
     <h2>{{content.name}}</h2> 
      <i class="icon ion-chevron-right icon-accessory"></i> 
      <ion-option-button class="button-assertive" ng-click="remove(content)"> 
      Delete 
      </ion-option-button> 
</a> 
     </ion-item> 

     </ion-list> 

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

これはチャットdetail.htmlと呼ばれる別のテンプレートにリダイレクトchat.htmlユーザーデータを表示します。

答えて

0

ユーザーを削除できないという問題があると想定します。これは、ユーザー配列(response.dataにあります)から削除するのではなく、何らかの理由でユーザー変数に保存したレスポンス自体から削除するためです。ここで

はあなたに役立つべきものである。

これはあなたのサービス

angular.module('starter.service', []) 
    .factory('Contents', ['$http', function($http) { 
    var users = []; 

    return { 
     get: function(){ 
     return $http.get("http://jsonplaceholder.typicode.com/users") 
      .then(function(response) { 
      users = response.data; 
      return users; 
      }); 
     }, 
     ... 
    }]); 

であり、これは

angular.module('starter.controller', []) 
    .controller('ChatCtrl', function($scope, Contents, $ionicModal) { 
    console.log('inside controller'); 
    Contents.get().then(function(users){ 
     //users is an array of user objects 
     $scope.contents = users; 
     console.log($scope.contents); 
    }); 

    $scope.remove = function(content) { 
     Contents.remove(content); 
    }; 
    }) 
    .controller('ChatDetailCtrl', function($scope, $stateParams, Contents) { 
    console.log('details'); 
    $scope.content = Contents.getUser($stateParams.chatId); 

    console.log($stateParams.chatId); 
    console.log($scope.content) 
    }); 

また、あなたのコントローラでは、私はあなたのように、何の名前を変更しませんでした私が修正したものを理解していますが、あなたがやりたいかもしれないいくつかの修正があります:

  • 、実際にユーザーが含まれている内容と呼ばれるものは本当に良いではないので、「UserServiceの」
  • 使用(コントローラ名を除く)どこでもキャメルケース
  • のようなものに内容が変数名(または$スコープのプロパティ)にもっと注意を払う名前を変更。

希望があれば教えてください。

+0

これが役立ったら、正しい答えとしてマークしてください。お役に立てて嬉しいです! –

関連する問題