Search Posts

Category: angular-material

md data table styling bug

how to md data table styling bug I’m having an issue with the styling of my headers. I’ve applied css to have a gray background with white header text but on scroll random chunks of my header turn completely white. It’s only happening with md data table, has anyone else come accross issues like this? It only happens when the user scrolls the table content. In chrome dev tools you can see the gray background […]

Checkbox color to be changed and checked in Angularjs Data table

how to Checkbox color to be changed and checked in Angularjs Data table I am using angular material data table. I have an issue in the check box in data table. Here is my data table <md-table-container> <table md-table md-row-select=”options.rowSelection” multiple=”{{options.multiSelect}}” ng-model=”selectedItemsToCreate” md-progress=”promise” animate-sort-icon=”true”> <thead ng-if=”!options.decapitate” md-head md-order=”query.order”> <tr md-row class=”md-row-height”> <th md-column md-order-by=”BDSparePartNumber”><span>Part #</span></th> <th md-column md-order-by=”BDSPCondition”><span>Part Condition</span></th> <th md-column md-order-by=”BDSPSerialNumber”><span>Part Serial #</span></th> <th md-column md-numeric><span>Line #</span></th> <th md-column md-numeric><span>Part Quantity</span></th> <th md-column md-order-by=”BDID” […]

Apply a filter as an attribute of a directive in angularjs

I have a custom filter that I need to add to the inner span of a directive and all of the examples of using a filter as an attr in the directive have not worked for me. Does anyone know how to make this work? Directive: import angular from ‘angular’; function userName() { return { restrict: ‘E’, scope: { user: ‘=’, dataFilter: ‘@’ }, template: require(‘./user-name.pug’), link: function($scope, $el, $attr, $filter) { let filter = […]

angular material2 data-table component

I’m trying to implement a table component from angular material component and all good and look nice, the big problem is how to populate the table with dynamic data from DB. I receive from DB a object array like in this example but I really don’t know how to iterate this and to populate my table. tablePopulate = [ {id: ‘1’, name: ‘Jimmy’, progress: ’10%’, color: ‘blue’}, {id: ‘2’, name: ‘John’, progress: ’40%’, color: ‘yellow’}, […]

How to give default or initial selection for md-checkbox where its data comes from JSON

I have a list of <md-checkbox> where it is repeated using JSON array. I want to give an initial selection for 2 checkboxes. Please help me on this. My js code: $scope.elecselected = []; $scope.toggle = function (elecitem, eleclist) { var idx = eleclist.indexOf(elecitem); if (idx > -1) { eleclist.splice(idx, 1); } else { eleclist.push(elecitem); } console.log(“item:”+elecitem+ ” List:”+ eleclist); }; $scope.exists = function (elecitem, eleclist) { return eleclist.indexOf(elecitem) > -1; }; $scope.electrical = [{“ID”:”161″,”Value”:”ABC”,”Name”:”AAAA […]

update the boolean value in md-select using angular material

am struggled in md-select model update when user changes the value need to update the flag as true.Actually i have to iterate the length of the model in md-select and in md-options i show like 1,2…5. if user changes the value in drop down means respective flag set to true other should be in false.kindly help me out this problem. following is my code and kindly tell me where i did the logical mistake: <html […]

Pop window does not closes after calling hide also in Angular JS

This is my function (function(){ ‘use strict’; function TablePopUpController($http, prod, tableName, $mdDialog, $scope,$timeout,$location) { $scope.tableName=tableName; var datas=[]; //$location.reload(); $scope.submitData = function() { if (tableName == ‘WFSmartPriority’) { var url = prod.TrfUrl + “/GetWFSmartPriority?tableName=” + tableName + “&OrgID=” + $scope.OrgID+”&”+prod.TrfApiKey+”&callback=JSON_CALLBACK”; $http.jsonp(url).success(function(data) { datas=data.GetWFSmartPriorityResult; // console.log(datas); hideData(datas);// Calling function to hide pop ip }); } else { if($scope.market==undefined) $scope.market=’ ‘; if($scope.OrgID==undefined) $scope.OrgID=0; if($scope.userGroupID==undefined) $scope.userGroupID=0; var url = prod.TrfUrl + “/GetWFMarketOrgUserGroup?tableName=” + tableName + “&OrgID=” + $scope.OrgID + […]

Next Page »