ng-repeat 和 ng-if 有条件

Question

<div class="styleColloboration" ng-repeat="item in colloborationMessages">
    <div  ng-if="item.myId == item.myPId">
    <b>{{item.msg}}{{item.cdate}}</b>
</div>
    <div ng-if="item.myId != item.myPId">{{item.msg}}{{item.cdate}}</div>
</div>

回复：

[{
    "cid": 11,
    "cmid": "34",
    "cdate": "2017-02-07 18:29:47",
    "postedby": "2",
    "msg": "hi salavadi",
    "myId": 22,
    "myPId": 22
},
{
    "cid": 11,
    "cmid": "33",
    "cdate": "2017-02-07 17:40:55",
    "postedby": "2",
    "msg": "hhhhd",
    "myId": 8,
    "myPId": 22
},
{
    "cid": 11,
    "cmid": "32",
    "cdate": "2017-02-07 17:31:34",
    "postedby": "2",
    "msg": "how are you ?",
    "myId": 8,
    "myPId": 22
},
{
    "cid": 11,
    "cmid": "31",
    "cdate": "2017-02-07 17:29:48",
    "postedby": "2",
    "msg": "This is new message",
    "myId": 22,
    "myPId": 22
},
{
    "cid": 11,
    "cmid": "21",
    "cdate": "2017-02-03 11:39:34",
    "postedby": "2",
    "msg": "Hi Priya , This is Jayasree Salavadi",
    "myId": 22,
    "myPId": 22
}]

我有一个收件箱，我的消息列表来自后端的相同响应。我需要根据 myId 和 myPid 将消息放置在各自的 html 块中，如果它们相同，它将在第一个块中，如果两者不相同，它将在第二个块中。我尝试这样做，但我只得到第二个块，其中包含所有消息。我使用 ng-if 条件来实现这一点，但它没有成功。

Answer 1

问题出在你的数据上，因为在所有对象中 myId 和 myPId 是不同的。

演示

var app = angular.module ('FunStuff',[]);
app.controller ('TextController',['$scope',function($scope){
    $scope.colloborationMessages = [
      {"cid":11,"cmid":"34","cdate":"2017-02-07 18:29:47","postedby":"2","msg":"hi salavadi","myId":8,"myPId":22},
      {"cid":11,"cmid":"33","cdate":"2017-02-07 17:40:55","postedby":"2","msg":"hhhhd","myId":8,"myPId":22},
      {"cid":11,"cmid":"32","cdate":"2017-02-07 17:31:34","postedby":"2","msg":"how are you ?","myId":8,"myPId":22},
      {"cid":11,"cmid":"31","cdate":"2017-02-07 17:29:48","postedby":"2","msg":"This is new message","myId":8,"myPId":22},
      {"cid":11,"cmid":"21","cdate":"2017-02-03 11:39:34","postedby":"2","msg":"Hi Priya , This is Jayasree Salavadi","myId":22,"myPId":22}
    ];
}]);

<!DOCTYPE html>
<html ng-app ="FunStuff">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.32/angular.min.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
    <title>LEARN JS</title>
    <meta charset="utf-8">
  </head>

  <body ng-controller="TextController" >
    <div class="styleColloboration" ng-repeat="item in colloborationMessages">
      <div  ng-if="item.myId == item.myPId">
        <b>{{item.msg}} {{item.cdate}}</b>
      </div>
      <div ng-if="item.myId != item.myPId">{{item.msg}} {{item.cdate}}</div>
    </div>
  </body>
</html>

ng-repeat 和 ng-if 有条件

ng-repeat and ng-if with conditions

angularjs

ng-repeat

angular-ng-if