How to dynamically insert items from a Array for the filter

How do I insert dynamically items from this array to the filter that is in wizard.html page , for when the templateUrl , which is on the route , make the call can be rendered in wizard.html page.
Controller

``` javascript
angular.module('tareasApp')
.controller('NatureCtrl', function ($scope, $routeParams) {
$scope.items =[
{
href:'/sound-waves',
img:'waves.jpg',
video:'//www.youtube.com/watch?v=OG2eGVt6v2o',
description:'Those Relaxing Sounds of Waves'
},
{
href:'/nature-relaxing-sound',
img:'ocean.jpg',
video:'//www.youtube.com/watch?v=SWR0GdC7_40',
description:'Nature Sounds Relaxing Ocean Sounds'
}
];
});
```

Page wizard.html

``` javascript

Route

``` javascript
angular.module('tareasApp')
.config(function ($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider

.when("/:pageName", {
templateUrl: "views/wizard.html",
controller: "PranksCtrl"
})
.otherwise({
redirectTo: '/'
});
});
```

The goal is to avoid having multiple pages with the same structure.