如何使用$ http获得特定的用户内容

Question

我是离子型的新手。我已经成功填充了用户列表和其余呼叫。 我想用$ 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> 

这chat.html重定向到被称为聊天detail.html另一个模板，显示用户数据。

Answer 1

我认为问题在于您无法删除用户。发生这种情况的原因是你并没有从users数组中删除（在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) 
    }); 

而且，我也没有什么重命名，所以你'd明白我修改了什么，但这里有一些你可能想要做的修改：

• 重命名内容要像“userService”
• 使用驼峰无处不在（除控制器名称）
• 更加注重变量名（或$作用域属性），因为它实际上包含了用户的一些所谓的内容是不是真的好。

希望这会有所帮助，如果不告诉我。