javascript - angular call function ng-repeat -
i have table different elements of ng-repeat. , json returns me date compare actual date , if less 72 hours return square green , if not red. pass elements in function return me last value in cell , print of same color. function gethour, other working.
var app = angular.module('dashboard', ['ui.bootstrap','ngsanitize']); app.controller('dashboardcontroller', function ($scope, $http, $modal, $sce, $sanitize) { $scope.gethour= function (input){ //console.log(input); var datos = input; input.foreach(function(data){ console.log(data); var date1 = new date(); var date2 = new date(data.lasthwevent); var date3 = new date(data.lasttestevent) var timediff = math.abs((date1.gettime() - date2.gettime())/(1000*60*60)); var timediff2 = math.abs((date1.gettime() - date3.gettime())/(1000*60*60)); if (timediff <= 72 || timediff2 <= 72) { console.log("verde"); $scope.html = '<span class="fa fa-square fa-3x"style="color:lime"></span>'; return $scope.trustedhtmlred =$sce.trustashtml($scope.html); } else { console.log("rojo"); $scope.html = '<span class="fa fa-square fa-3x"style="color:red"></span>'; return $scope.trustedhtmlred = $sce.trustashtml($scope.html); } }) } $scope.objects = []; $scope.grupos = []; $scope.longitud = []; $scope.eventos = []; //funci?n que devuelve las instalaciones de un usuario $http.get(urloperation, $scope) .success(function (data) { var groups = data; angular.foreach(groups, function (group) { var group2 = group; angular.foreach(group2.sites, function (group3) { $scope.longitud.push(group3); $scope.objects.push(group3); $scope.predicate = 'msisdn'; $scope.reverse = true; $scope.order = function (predicate) { $scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false; $scope.predicate = predicate; }; }) }); }) .error(function (data) { window.alert('something wrong...'); }); }); code html
<table id="tableinventario" class="table table-bordered table-hover table-responsive table-striped datatable no-footer" data-sort-name="name" data-sort-order="desc"> <tr role = "row" class="info text-center"> <th ng-click="order('msisdn')">número teléfono</th> <th ng-click="order('icc')">icc</th> <!--th>imei</th--> <th ng-click="order('activationstatus')">estado</th> <th ng-click="order('sitename')">instalación</th> <th ng-click="order('siteaddress')">dirección</th> <th ng-click="order('sitecity')">ciudad</th> <th ng-click="order('sitezip')">código postal</th> <th ng-click="order('phonedesc')">modelo teléfono</th> <th >en-8128</th> </tr> <tr class=" text-center" ng-repeat-start="object in filteredsites = (objects | filter:searchtext | filter:{parentgroupid:selectedgroup||undefined}) | filter:tablefilter| orderby:predicate:reverse" ng-click="showdetails = ! showdetails" > <td>{{object.msisdn}}</td> <td>{{object.icc}}</td> <!--td>{{object.activationstatus}}</td--> <td><span ng-init="countestatus(filteredsites)" ng-show="object.activationstatus=='ac' && object.contractingmode=='0'" class="fa fa-square fa-3x"style="color:lime"></span><span ng-show="object.contractingmode=='2' && object.activationstatus=='ac' " ><img src="../img/vodafone_logo.png" width="40" height="40" style="background-color: lime"></span><span ng-show="object.activationstatus=='pa'" class="fa fa-square fa-3x"style="color:yellow"></span><span ng-show="object.activationstatus=='de'" class="fa fa-square fa-3x"style="color:red"></span></td> <td>{{object.sitename}}</td> <td>{{object.siteaddress}}</td> <td>{{object.sitecity}}</td> <td>{{object.sitezip}}</td> <td ng-init="getphonemodel(filteredsites)">{{model}}</td> <td ng-bind-html="trustedhtmlred" ng-bind-html="trustedhtmlgreen">{{gethour(filteredsites)}}</td> </tr> <tr ng-repeat-end ng-show="showdetails"> <td colspan="2"> <a> teléfono</a> <div>{{object.msisdn}}</div><a>icc:</a> <div> {{object.icc}}</div> <div><a> imei</a> {{object.imei}}</div> <div><a> Último evento hw</a> {{object.lasthwevent | date:'mm-dd-yyyy hh:mm:ss'}}</div></td> <td colspan="3"> <a> id instalación</a> <div>{{object.liftsiteid}}</div><a>dirección:</a> <div> {{object.siteaddress}}</div> <div><a> código postal</a> {{object.sitezip}}</div> <div><a> ciudad</a> {{object.sitecity}}</div></td> <td colspan="2"> <a>modelo teléfono</a><div></div><a>comentarios:</a> <div> {{object.comments}}</div> </td> <td colspan="2"> <div><a> rae1: </a> {{object.rae1}}</div> <div><a> rae2: </a> {{object.rae2}}</div> <a>pin1:</a> <div> {{object.pin1}}</div> <div><a> pin2: </a> {{object.pin2}}</div></td> <td colspan="1"> <div> <button class="btn btn-info" ng-click="open(object)">eventos</button></div> </td> <div > </div> </tr> </table> where have problem in column en-8128.
for example in case have 1 green , others red. print me green. 
in gethour function, setting global variables ($scope.trustedhtmlred , $scope.trustedhtmlgreen), that's why last value applied rows.
you should set value object:
input.lessthan72h = gethour(input); // true or false then in html, like:
<td><span class="fa fa-square fa-3x" ng-style="{color: input.lessthan72h ? 'lime' : 'red'"></span></td> or better use css classes
Comments
Post a Comment