Search Posts

Category: angular-filters

AngularJS change currency display by manipulating the $locale

So I’m struggling with this issue for some time now and yet I couldn’t find an answer. Basically I’ve this: const formattedCurrency = $filter(‘currency’)(input); This returns me something like this $0.00 ($ seem to be the default angular curency CURRENCY_SYM:”$”) What I want to achieve is to make this return not $0.00but a dynamic currency, for example €0.00 or £0.00. So let’s assume that I have a html page with this text: I have $0.00 […]

angular js highlighter filter highlight text and change text also

my highlight filter: app.filter(‘highlightWord’, function () { return function (isSectionData, selectedWord) { if (!isSectionData) return ”; // var items = selectedWord.split(” “); var items = selectedWord.trim().replace(/ OR /g, ‘ ‘).replace(/ AND /g, ‘ ‘).replace(/ – /g, ”).replace(/-/g, ”).replace(/”/g, ”).split(‘ ‘); for (var i = 0, len = items.length; i < len; i++) { var pattern = new RegExp(items[i], “gi”); if (isSectionData && items[i] != “”) { isSectionData = isSectionData.replace(pattern, ‘<span class=”highlighted”>’ + items[i] + ‘</span>’); […]

GroupBy and limitTo does not work together ? AngularJS

I googled very hard but can’t find solution for this. I want to use groupBy and limitTo together but its does not work. My code: <ul ng-repeat=”(key, value) in items | groupBy: ‘group’ | limitTo: limit”> … </ul> JS: $scope.limit = 2; // its dinamic value $scope.items = [ {name: “Audi”, group:1}, {name: “BMW”, group:1}, {name: “Dodge”, group:2}, {name: “Fiat”, group:2}, {name: “Ford”, group:3} ]; If they are seperate, then its work, but when they […]

Angular (1.x) filter not working with array of objects

I am trying to take input a search term like so: <div class=”form-group”> <input type=”text” class=”form-control” ng-model=”vm.search.term” placeholder=”Enter search term”> </div> And then using this search term as filter on an array of objects being rendered using ng-repeat, like so: <tbody> <tr ng-repeat=”p in vm.items track by $index | filter: vm.search.term”> <td><a>{{p.uid}}</a></td> <td>{{p.em}}</td> <td>{{p.ct | date:’medium’}}</td> </tr> </tbody> But in the developer’s console, I am getting the following error: dashboard-js-bundle.min.js:117 Error: [filter:notarray] http://errors.angularjs.org/1.5.5/filter/notarray?p0=0 at dashboard-js-bundle.min.js:6 […]

ng-show working with multiple filters in ng-repeat

I have an ng-repeat list with multiple filters, but as I need the elements to be hidden and not removed from the DOM, I use ng-show for the filtering. This is how my first filter look like: <a href=”” ng-click=”myFilter = ”; toggle = toggle=0; togglesec=0; mySecondFilter = {}” ng-class=”{‘active’ : toggle==0}” > Tot </a> <a href=”” ng-click=”myFilter = ‘pa’; toggle = toggle=1; togglesec=0; mySecondFilter = {}” ng-class=”{‘active’ : toggle==1}”> Pa </a> <a href=”” ng-click=”myFilter […]

AngularJs filter with a conditional condition

I am not sure if this is possible, but any insight would be much appreciated. I am trying to filter a duration for an album with a custom angularJs filter that is already provided for me. I want to either show hours if its available or not to show it at all if its not. I tried using something like: <span>{{ media.duration | peDateFormatFilter: ((HH > 0) ? {“HH:mm:ss”:{ “def”: “H[ hrs] mm[ mins]”}} : […]

Uncaught Error: Unknown provider: $filterProvider from myapp

I am getting following error: ( Uncaught Error: Unknown provider: $filterProvider from myapp) while using following code. Please help to solve it. Uncaught Error: Unknown provider: $filterProvider from myapp at angular.min.js:29 HTML——————— <script src=”http://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js”>`</script> <div ng-app=”myapp” ng-controller=”WeatherCtrl”> <h2>Weather in Salzburg, Austria</h2> <weather-icon cloudiness=”{{ weather.clouds }}”></weather-icon> <h3>Current: {{ weather.temp.current | temp:2 }}</h3> min: {{ weather.temp.min | temp }}, max: {{ weather.temp.max | temp }} </div> Source code (.js)——————- ‘use strict’; var myapp = angular.module(‘myapp’, []); myapp.factory(‘weatherService’, […]