在Angularjs中對警報進行分組

我想根據notificationSubject對警報進行分組。如果 > notificationSubject鍵值的長度（dosMinus）> 1意味着它將在第一個div和notificationSubject鍵值長度（DOS > etc）中顯示 > == 1表示它將顯示在第二個div中例如，以下 > json包含notificationSubject = dosMinus有2次存在，剩餘的每個記錄爲 >。我想在第一格中顯示'dosMinus'，並在第二格中顯示剩餘的警報。 ** - >

在Angularjs中對警報進行分組

var myapp = angular.module('myapp', []); 
 
myapp.controller('myctrl', ['$scope', function ($scope) { 
 
    $scope.alerts = { 
 
     "DISPLAY_ALERT_DETAILS": [ 
 
      { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492732800000 
 
       , "severity": "low" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "dosMinus" 
 
       , "notificationDetails": "Lorem Ipsum is simply dummy text of the printing and typesetting industry." 
 
    } 
 

 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492732800000 
 
       , "severity": "low" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "dosMinus" 
 
       , "notificationDetails": "Lorem Ipsum is simply dummy text of the printing and typesetting industry." 
 
    } 
 

 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492992000000 
 
       , "severity": "low" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "DOS" 
 
       , "notificationDetails": "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s" 
 
    } 
 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492992000000 
 
       , "severity": "informational" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "EO" 
 
       , "notificationDetails": "Lorem Ipsum is simply dummy text of the printing" 
 
    } 
 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492992000000 
 
       , "severity": "informational" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "Late Sales Orders" 
 
       , "notificationDetails": "It has survived not only five centuries" 
 
    } 
 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492992000000 
 
       , "severity": "informational" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "Late Purchase Orders" 
 
       , "notificationDetails": "It was popularised in the 1960s with " 
 
    } 
 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492992000000 
 
       , "severity": "informational" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "Demand" 
 
       , "notificationDetails": "It was popularised in the 1960s with the release of Letraset sheets containing " 
 
    } 
 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492992000000 
 
       , "severity": "informational" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "Spend" 
 
       , "notificationDetails": "more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum." 
 
    } 
 
     , { 
 
       "alertRaisedUserId": 1215 
 
       , "source": 1 
 
       , "clientTimestamp": 1492992000000 
 
       , "severity": "informational" 
 
       , "createdByMe": "Y" 
 
       , "notificationSubject": "Inventory" 
 
       , "notificationDetails": "It was popularised in the 1960s with the release of Letraset " 
 
    } 
 
    ] 
 
    } 
 
}]);

<html ng-app="myapp"> 
 

 
<head> </head> 
 

 
<body ng-controller="myctrl"> 
 
    <div> 1. Div (Display dosMinus)</div> 
 
    <div> 2. Div (Display DOS....Etc)</div> 
 
</body> 
 

 
</html>

來源

2017-05-04 Arun

基於您的評論：

我想在第一次股利和>在第二格剩餘的警報，顯示 'dosMinus'。

下面是一個使用ng-if的簡單代碼：

<html ng-app="myapp"> 
    <head> </head> 
    <body ng-controller="myctrl" ng-repeat="a in alerts.DISPLAY_ALERT_DETAILS"> 
    <div> 1. Div <span ng-if="a.notificationSubject == 'dosMinus'">{{a.notificationSubject}}</span></div> 
    <div> 2. Div <span ng-if="a.notificationSubject != 'dosMinus'">{{a.notificationSubject}}</span></div> 
    </body> 
</html>

編輯

選擇基於沒有。每個notificationSubject的發生次數，你必須得到每個的計數，並根據這個選擇使用div2的div1使用ng-if。

這裏的JS代碼來設置和獲取數：

var count = {}; 
$scope.alerts = ...//your JSON 

for(var i=0;i<$scope.alerts.DISPLAY_ALERT_DETAILS.length;i++) { 
    setCount($scope.alerts.DISPLAY_ALERT_DETAILS[i].notificationSubject); 
} 

function setCount(notSub) { 
    if(count[notSub]) { 
     count[notSub]++; 
    } 
    else { 
     count[notSub] = 1; 
    } 
} 
$scope.getCount = function(notSub) { 
    return count[notSub]; 
}

，並有條件地使用div的，你可以調用$scope.getCount從HTML獲得計數。

<body ng-controller="myctrl" ng-repeat="a in alerts.DISPLAY_ALERT_DETAILS"> 
    <div> 1. Div <span ng-if="getCount(a.notificationSubject)>1">{{a.notificationSubject}}</span></div> 
    <div> 2. Div <span ng-if="getCount(a.notificationSubject) == 1">{{a.notificationSubject}}</span></div> 
</body>

來源

2017-05-04 19:56:10

Notifications對象長度大於1意味着它將顯示在第一個div中並且Notifications對象的長度等於1，那麼它將顯示在第二個div中。當前的json包含dosMinus兩次，那麼你的條件是ok的，但DOS和EO和Riskscore也會出現兩次或更多次。我們需要在第一個div中顯示多個記錄顯示，在第二個div中顯示剩餘的顯示。 – Arun

你的意思是Notifications的對象長度是多少？ Notifications對象的字符串值的長度，例如''dosMinus'.length = 8'，或者dosMinus在JSON中出現的次數，在這種情況下是2，其他情況是1？ –

在Json中發生dosminus的次數 – Arun

在Angularjs中對警報進行分組

回答

相關問題