0

js i have this...

controller: "photogridCtrl",
templateUrl: 'js/ng-assets/templates/directives/photogrid-view.html',
scope: '=info'

in my controller i have 2.

$scope.home = [
    {
        img: 'img/burlington.jpg', 
        label: 'Burlington', 
        action: '#/', 
        row:'col-md-12', 
        class:''
    }

and the other one is...

$scope.featured = [
    {
        img: 'img/kitchener.jpg', 
        label: 'Kitchener', 
        action: '#/', 
        row:'col-md-12', 
        class:''
    }

in my view...

<div class="photo-grids">
    <div class="row">
        <div class='{{item.row}} margin-bottom' ng-repeat='item in home'>
        <a href="{{item.action}}" class="photo-item {{item.class}}" style="background-image:url({{item.img}});">
        <span class="photo-caption"><h4>{{item.label}}
        <br><small>Ontario</small></h4></span>
        </a>
    </div>
</div>

and in my main index i have 2 party of the page where i want to display the photogrid-view.html

<photogrid-view></photogrid-view>

<photogrid-view info='featured'></photogrid-view>

Now as you can see in my ng-repeat i have "item in home" I just want to ask how I can change home to something that will change depending on the variable in <photogrid-view info='featured'></photogrid-view so if it is featured it will output the values from $scope.featured and if the info=home then it will output the values from $scope.home. So it would be like...

If info=='home' then ng-repeat="item in home" else if info==''featured then ng-repeat="item in featured" sorry for the long explanation. But thanks! :)

jeeeee
  • 229
  • 1
  • 5
  • 18
  • if you use a isolated scope, you can use ng-repeat="item in info" and set info from the outside like info before. Or is the controller the controller of the component/directive? – Thomas Zoé Sep 01 '16 at 15:23
  • How will i get the value from Info? – jeeeee Sep 01 '16 at 15:47
  • I haven't seen the syntax you are using before, but it seems you are using a directive. If you use scope: {info:'='} and the value of $scope.myArray is automatically bound to the isolated scope of the directive. – Thomas Zoé Sep 02 '16 at 08:17

2 Answers2

1
$scope.returnArray = function(){
    if($scope.info){
        return $scope.featured;
    }
    return $scope.home;
}

in view:

<div class='{{item.row}} margin-bottom' ng-repeat='item in returnArray()'>

or: 

<div ng-init="entities = returnArray()"></div>
<div class='{{item.row}} margin-bottom' ng-repeat='item in entities'>

or just in view:

<div ng-show="info" class='{{item.row}} margin-bottom' ng-repeat='item in featured'>
<div ng-hide="info" class='{{item.row}} margin-bottom' ng-repeat='item in home'>
KoIIIeY
  • 533
  • 1
  • 7
  • 26
  • You cannot iterate over function using ngRepeat, see this [question](http://stackoverflow.com/questions/12336897/how-to-loop-through-items-returned-by-a-function-with-ng-repeat). Also `ng-init` doesn't watch changes and as result list won't be updated. So first 3 examples are incorrect. – G07cha Sep 01 '16 at 15:28
  • how will i get the value of info from ? if info == featured then return $scope.featured? – jeeeee Sep 01 '16 at 15:40
  • I'm sorry about the function, @KoIIIeY you're right, it doesn't work with raw values but for variables, it does the job. By changes, I meant changing list. – G07cha Sep 01 '16 at 16:12
  • @jeeeee , 'info' in your example is variable from scope, if you want (and really, you want :) ) you can remove second ng-repeat div, and ng-repeat use like
    Next in your view, , where 'featured' - array from scope, $scope.featured :)     – KoIIIeY Sep 02 '16 at 07:30
  • and yep, I'm and Mikey forgot to close div tag :D – KoIIIeY Sep 02 '16 at 07:31
1
<div ng-if="info === 'featured'" class='{{item.row}} margin-bottom' ng-repeat='item in featured'></div>
<div ng-if="info === 'home'" class='{{item.row}} margin-bottom' ng-repeat='item in home'></div>

This can be achieved easily with ng-if. In my opinion this is better than ng-show because this only appends it to the DOM if the condition is met, while ng-showjust hides it.

Michelangelo
  • 5,888
  • 5
  • 31
  • 50