CODEWITHSUNDEEP
angularjsecmascript-6
José María
José María

Reputation: 809

How to use ES6 Map with AngularJS ng-repeat

Is the ng-repeat of AngularJS 1.x compatible with ES6 Maps?

Upvotes: 5

Views: 1944

Answers (3)

Eugene M
Eugene M

Reputation: 51

The easiest way is to create your own angular filter as @Minato suggested.

You can use ES6 Spread syntax to convert map into array:

angular.module('SomeModuleName')
.filter('mapToArray', function() {
    return function(map) {
        return [...map.values()];
    };
});

And then just use it in the template:

<div ng-repeat="item in Map | mapToArray">

You can also use lodash toArray method: https://lodash.com/docs/4.17.4#toArray

Upvotes: 5

Kilian Obermeier
Kilian Obermeier

Reputation: 7168

See my answer here for a solution to bind ng-repeat to an ES6 Map in Angular 1.x.

Upvotes: 0

Minato
Minato

Reputation: 4533

ngRepeat currently doesn't support Map.. to use it either you have to convert it into a JavaScript Array first.. or write a filter to convert it while using it.

see angular-toArrayFilter for reference. You can also create you very own filter like toArraFilter and use it with Map inside ngRepeat.

Upvotes: 3

Related Questions