angularjs - How to implement ng-if within ng-repeat for array of objects condition? -
this code
var app = angular.module('plunker', []); app.controller('mainctrl', function($scope) { $scope.masterdata=[ {id:1,name:"name1"}, {id:2,name:"name2"}, {id:3,name:"name3"}, {id:4,name:"name4"}, {id:5,name:"name5"}, {id:6,name:"name6"}, {id:7,name:"name7"}, {id:8,name:"name8"}, {id:9,name:"name9"} ] $scope.columndata = { key1 : { id : 1, name : 'name1' }, key2 : { id : 2, name : 'name2' }, key3 : { id : 11, name : 'name3' } }; });<!doctype html> <html ng-app="plunker"> <head> <meta charset="utf-8" /> <title>angularjs plunker</title> <script> document.write('<base href="' + document.location + '" />'); </script> <link rel="stylesheet" href="style.css" /> <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.15/angular.js" data-semver="1.3.15"></script> <script src="script.js"></script> </head> <body ng-controller="mainctrl"> <table> <tr ng-repeat="(key,value) in columndata"> <td ng-if="masterdata.id.indexof(value.id)==-1"> <a href="#" class="btn btn-primary btn-dark" > {{value.name}} </a> </td> <td ng-if="masterdata.id.indexof(value.id)!=-1"> <a href="#" class="btn btn-primary btn-dark" ng-disabled="true"> {{value.name}} </a> </td> </tr> </table> </body> </html>in above code have 1 array contains multiple objects , have 1 dictionary.i write code checking dictionary object exists in array or not using ng-if not working properly. want disable dictionary ids present in array disabled using angularjs in html view only. plunker.
you add function scope this
$scope.isinmasterdata = function(id) { return $scope.masterdata.map(function(obj) { return obj.id }).indexof(id) !== -1; }; in html call so
<td ng-if="!isinmasterdata(value.id)"> <a href="#" class="btn btn-primary btn-dark" > {{value.name}} </a> </td> <td ng-if="isinmasterdata(value.id)"> <a href="#" class="btn btn-primary btn-dark" ng-disabled="true"> {{value.name}} </a> </td>
Comments
Post a Comment