Change angular ui-view inside ng-repeat

Question

I use multiple ui-views names in one controller. Everything works as it was shown when the ui-view name in the html file with this code:

<div class="box"> 
  <div ui-view="selector"></div>  

  <div ui-view="widget1"></div>
  <div ui-view="widget2"></div>
  <div ui-view="widget3"></div>
  <div ui-view="widget4"></div>
</div>

But when I want to dynamically load some of these views using ng-repeat, it does not update the information.

<div class="widgets">
  <div class="widget-container" ng-repeat="widget in widgets">
    <div ui-view="{{widget}}"></div>
  </div>
</div>

How can I load ui-views from my ng-repeat?

Answer 1

They did not answer this, so I decided to continue and show how to do it. Unfortunately, for some reason, the attempt in the question did not work, but what you can do is reference the function between the curly braces and return a line of the desired representation. For example, the controller would look like this:

$scope.groups = ['main','cases', 'models']; $scope.pickView = function(index){ return $scope.groups[index]; };