2015-09-27 90 views
2

我写了下面的代码为点击NG重复的第一个元素,使它激活默认:默认点击NG单击angularjs

<ul id="thumbnails"> 
     <li ng-repeat="thumbnail in thumbnails | filter:query" ng-switch on='$first' data-ng-click="toggleObject.item = $index" > 
      <div data-ng-class="{'active' : toggleObject.item == $index}" ng-switch-when='true' ng-click="getHdImage(thumbnail.IMAGE_ID)"> 
       <img id="imageViewContainer" ng-src="{{thumbnail.PATH_SMALL}}"/> 
      </div> 
     </li> 
    </ul> 

控制器:

 imageView.getViewsByGroupId($stateParams.groupid) 
        .success(function(data) { 
         $scope.thumbnails = data; 
         $scope.toggleObject = {item: -1}; 
         console.log($scope); 
     }); 

所以我可以使用这个活动类来使背景颜色为红色。但默认点击第一个元素不会发生。尽管点击手动工作得很好。

我在做什么错在这里。

+0

使用ng-repeats $ first代替。 https://docs.angularjs.org/api/ng/directive/ng重复 – toskv

回答

2

您可以使用$第一个作用域变量ng-repeat作为您的作用域。

也可以使用ng-init进行一些初始化。

<ul id="thumbnails"> 
    <li ng-repeat="thumbnail in thumbnails | filter:query" data-ng-click="toggleObject.item = $index"> 
    <div data-ng-class="{'active' : $first}" ng-init="$first && getHdImage(thumbnail.IMAGE_ID)" ng-click="getHdImage(thumbnail.IMAGE_ID)"> 
     <img id="imageViewContainer" ng-src="{{thumbnail.PATH_SMALL}}" /> 
    </div> 
    </li> 
</ul> 

您可以检查this小plunker该演示的吧。

+0

默认类为$第一次正在发生,但默认点击没有发生,这实际上是我的关注。点击我有一个函数来调用。 – user2696466

+0

你可以使用** ng-init **初始化一个属性,我将其添加到该示例中。 :) – toskv

+0

是的,我试过了,它的工作,但我仍然无法理解ng-switch – user2696466