J'ai une portée appelée $scope.users qui renvoie tous les utilisateurs de mon application comme ceci,

[{"id":1,"name":"Peter Boomsma"},
 {"id":2,"name":"Jan Jansen"},
 {"id":3,"name":"Kees Keesen"},
 {"id":4,"name":"Piet Pietersen"}]

Ensuite, j'ai une portée appelée $scope.current_user qui renvoie les utilisateurs actuels, et les identifiants des utilisateurs qu'il suit,

{"id":4,"name":"Piet Pietersen","following":[
  {"id":1},{"id":2},{"id":4}]
}

J'ai un ng-repeat qui montre tous les utilisateurs, et une action followUser par utilisateur,

%ul{"ng-repeat" => "user in users"}
  %li
    name: {{ user.name }}
    %a{"ng-click" => "followUser(user)"} Follow user.

Le problème est que je ne peux pas faire la différence entre un utilisateur déjà suivi et un utilisateur non suivi. L'action followUser est donc toujours là. Je voudrais indiquer aux utilisateurs que l'utilisateur actuel suit une action différente, telle que unfollowUser.

J'ai les identifiants des utilisateurs que l'utilisateur actuel suit, mais je ne sais pas comment donner à ces utilisateurs un autre bouton. Quelque chose comme unfollowUser.

* mise à jour *

Je l'ai fait fonctionner (un peu au moins), en utilisant Mihail sa suggestion,

Quand je vais sur mon modèle d'utilisateur, je charge le userCtrl,

usersService.loadUsers().then(function(response) {
  $scope.users = response.data;

  angular.forEach(response, function(user){
    $scope.user = user

    $scope.isFollowed = function(userId) {
      var following = $scope.current_user.following;
      for (var i=0; i<following.length; i++) {
        if (following[i].id == userId) {
          return true;
        }
      }
      return false;
    }
  })
})

Et dans mon modèle j'ai,

%ul{"ng-repeat" => "user in users"}
  %li
    name: {{ user.name }}
    %a{"ng-click" => "followUser(user)", "ng-show" => "!isFollowed(user.id)"} follow
    %a{"ng-click" => "unfollowUser(user)", "ng-show" => "isFollowed(user.id)"} unfollow

Cela fonctionne très bien. Lorsqu'un utilisateur est suivi, la fonction unfollowUser est utilisée. Le problème est que lorsque je désabonne l'utilisateur, la vue n'est pas mise à jour. Je dois actualiser la page pour voir l'effet de l'action de désabonnement.

J'ai essayé de mettre un init à la fin de l'action unfollowUser comme ceci,

$scope.unfollowUser = function(user){
  unfollowFriend.unfollowFriend(user).then(function(){
  },function(){
  }).then(init);
  Notification.success(user.name + ' is verwijderd als vriend.');
}

L'init,

var init = function(){
  console.log ('renew')
  usersService.loadUsers().then(function(response) {
    $scope.users = response.data;

    angular.forEach(response, function(user){
      $scope.user = user

      $scope.isFollowed = function(userId) {
        var following = $scope.current_user.following;
        for (var i=0; i<following.length; i++) {
          if (following[i].id == userId) {
            return true;
          }
        }
        return false;
      }
    })
  })
}

Je reçois le message renew dans le journal de mon navigateur, mais la vue n'est pas mise à jour.

0
Peter Boomsma 3 janv. 2016 à 21:57

2 réponses

Meilleure réponse

Je ne suis pas bon en haml, donc j'écrirai un simple exemple html:

<div ng-repeat="user in users">
  <div ng-show="isFollowed(user.id)" ng-click="unfollowUser(user)">unfollow</div>
  <div ng-show="!isFollowed(user.id)" ng-click="followUser(user)">follow</div>
</div>


$scope.isFollowed = function(userId) {
  var following = $scope.current_user.following;
  for (var i=0; i<following.length; i++) {
    if (following[i].id == userId) {
      return true;
    }
  }
  return false;
}
2
Mihail Petkov 3 janv. 2016 à 20:01

Vous pouvez créer une fonction qui vérifie si un utilisateur donné est déjà suivi comme:

$scope.isFollowed = function (userID) {
  //check if the userID is in$scope.current_user.following
  //return a boolean
}

Ensuite, dans le code HTML, vous pouvez vérifier en fonction de cette fonction si vous souhaitez afficher followUser ou unfollowUser.

1
Ramy Rais 3 janv. 2016 à 19:06