Repeat inside attribute with Angular

Question

I have a simple string array which represents classes:

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.classes = ["one","two","three","four"];
}

I would like to bind these inside the class attribute of a single element as such:

<div ng-controller="MyCtrl">
  <div ng-repeat="class in classes" class="{{class}}"></div>
</div>

And render the following:

<div class="one two three four"></div>

I can't find a resource which explains how to do this. The code above generates:

<div class="one"></div>

How do I repeat INSIDE of the element with the ng-repeat?

http://jsfiddle.net/Lvc0u55v/788/

Answer 1

You don't need ng-repeat, just ng-class, which accepts an array as input.

<div ng-class="classes"></div>

https://docs.angularjs.org/api/ng/directive/ngClass