Use ng-repeat to create multiple nav-view

ionic-v1
1

Hi,

Is it possible to use ng-repeat to create multiple tabs with nav-view?
The following does not work.
We are trying to dynamically create tabs base on JSON data.

Example,

View

  <ion-tabs tabs-style="tabs-icon-top" tabs-type="tabs-positive">
        <ion-tab title="{{step.title}}" ng-repeat="step in steps"  ui-sref="{{step.uiSref}}">
            <ion-nav-view name="{{step.view}}"></ion-nav-view>
        </ion-tab>
  </ion-tabs>

Controller

.controller(‘MainStepController’, function($scope) {
var steps = [
{ title: “Step 1 - Main”, uiSref: “tabs.step1”, view: “step1-tab”},
{ title: “Step 2 - Supp”, uiSref: “tabs.step2”, view: “step2-tab”},
{ title: “Step 3 - Finalize”, uiSref: “tabs.step3”, view: “step3-tab”}
];
$scope.steps = steps;
})

StateProvider

$stateProvider

	.state('tabs', {
		url: "/tab",
		abstract: true,
		templateUrl: "tabs.html",
		controller: 'MainStepController'
	})

	.state('tabs.step1', {
		url: "/step1",
		views: {
			'step1-tab': {
				templateUrl: "step1.html",
				controller: 'Step1Controller'
			}
		}
	})
	
	.state('tabs.step2', {
		url: "/step2",
		views: {
			'step2-tab': {
				templateUrl: "step2.html",
				controller: 'Step2Controller'
			}
		}
	})
2

I had the same problem and couldn’t fix it. it seems the name of the ion-nav-view can’t be generated dinamically.
Did you find any workaround?.