Угловой JS - вызов функции каждый раз, когда повторы ng-repeat

Question

У меня есть базовая служба обмена сообщениями, которая покажет кому-то сообщение, если оно будет отправлено им. Поэтому у меня есть массив, содержащий строки имен участников этих цепочек. Я хочу показать ng-show, чтобы показать комментарий, если имя пользователя человека находится в массиве. Но, поскольку есть много сообщений, у меня есть ng-repeat, который проходит через них. Это означает, что мне нужно будет выполнить функцию, которая определяет, находится ли кто-нибудь в чате каждый раз, когда повторы ng-repeat повторяются. У кого-нибудь есть идеи? Благодарю.

.msghead{ 
 
    text-decoration: underline; 
 
} 
 
.thread{ 
 
    border: 1px solid black; 
 
    padding: 10px 10px; 
 
    overflow: hidden; 
 
    cursor: hand; 
 
    width: 99%; 
 
} 
 
body{ 
 
    margin: 0px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app='Messaging' ng-controller='MessagingCtrl as Messaging'> 
 
    <div ng-repeat='threads in Messaging.messages' class='thread' ng-show='Messaging.authorized'> 
 
    <p ng-repeat='msgs in threads.message'> 
 
     <span class='msghead'> {{ msgs.author }} </span><br> 
 
     {{ msgs.msg }} <br> 
 
    </p> 
 
    </div> 
 
</div> 
 
<script> 
 
    var app = angular.module('Messaging',[]); 
 
    app.controller('MessagingCtrl',function(){ 
 
     this.messages = [ 
 
      { 
 
       members: ['Bob','Jeff'], 
 
       message: [ 
 
        { 
 
         author: 'Bob', 
 
         msg: 'Hello and welcome to this messaging service.' 
 
        }, 
 
        { 
 
         author: 'Jeff', 
 
         msg: 'Great work! Very impressive, Bob!' 
 
        }, 
 
       ] 
 
      }, 
 
      { 
 
       members: ['Bob','Jeff','Dan'], 
 
       message: [ 
 
        { 
 
         author: 'Bob', 
 
         msg: 'Hello and welcome to this messaging service. This is another thread!' 
 
        }, 
 
        { 
 
         author: 'Dan', 
 
         msg: 'Great work! Very impressive, Bob!' 
 
        }, 
 
        { 
 
         author: 'Jeff', 
 
         msg: 'Stop copying me!' 
 
        }, 
 
       ] 
 
      }, 
 
     ]; 
 
     this.authorize = function(){ 
 
      for(var count = 0;count < this.messages.length;count++){ 
 
       if(this.messages[count] === this.name){ 
 
        this.authorized = false; 
 
       } 
 
       if(count === this.messages.length){ 
 
        this.authorized = true; 
 
       } 
 
      } 
 
     } 
 
     this.name = 'Bob'; 
 
     this.authorized = true; 
 
    }); 
 
</script>

Я попытался выполнения функции в нг-шоу - это называется, но я не могу получить результат в нг-шоу впоследствии.

Я пробовал ng-init, который ничего не сделал.

Answer 1

На мой взгляд, простое решение: вам просто нужно отфильтровать массив сообщений, а затем вызвать ng-repeat с фильтрованным массивом сообщений.

Например, приведенный ниже код отображает все сообщения, принадлежали к Дэну

var app = angular.module('Messaging', []); 
 
app.controller('MessagingCtrl', function() { 
 
    this.messages = [{ 
 
    members: ['Bob', 'Jeff'], 
 
    message: [{ 
 
     author: 'Bob', 
 
     msg: 'Hello and welcome to this messaging service.' 
 
    }, { 
 
     author: 'Jeff', 
 
     msg: 'Great work! Very impressive, Bob!' 
 
    }, ] 
 
    }, { 
 
    members: ['Bob', 'Jeff', 'Dan'], 
 
    message: [{ 
 
     author: 'Bob', 
 
     msg: 'Hello and welcome to this messaging service. This is another thread!' 
 
    }, { 
 
     author: 'Dan', 
 
     msg: 'Great work! Very impressive, Bob!' 
 
    }, { 
 
     author: 'Jeff', 
 
     msg: 'Stop copying me!' 
 
    }, ] 
 
    }, ]; 
 

 
    //Filter the messages array. 
 
    //Only get the massage with membems contains Dan 
 
    this.filteredMessages = this.messages.filter(function(mes) { 
 
    return mes.members.indexOf('Dan') != -1; 
 
    }); 
 
});

.msghead { 
 
    text-decoration: underline; 
 
} 
 
.thread { 
 
    border: 1px solid black; 
 
    padding: 10px 10px; 
 
    overflow: hidden; 
 
    cursor: hand; 
 
    width: 99%; 
 
} 
 
body { 
 
    margin: 0px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app='Messaging' ng-controller='MessagingCtrl as Messaging'> 
 
    <div ng-repeat='threads in Messaging.filteredMessages' class='thread'> 
 
    <p ng-repeat='msgs in threads.message'> 
 
     <span class='msghead'> {{ msgs.author }} </span> 
 
     <br>{{ msgs.msg }} 
 
     <br> 
 
    </p> 
 
    </div> 
 
</div>