Question

当我点击ng-repeat中的数据时，我试图显示确切的内容。

<div ng-repeat="trailSpot in trail.wayPoints">
   <a ng-click="viewState.showSpotDetails = !viewState.showSpotDetails">
      <p>Spot {{$index + 1}}. {{trailSpot.wpName}}</p>
   </a>
   <p >{{trailSpot.wpDescription}}</p>
</div>

当我点击第一个wpName时，我想只显示另一个div上第一个wpName的wpDescription。我应该把那个div放进去。

<div class="panel-body" ng-show="viewState.showSpotDetails">
        <div>
            ???
        </div>
</div>

有人对我要做的事情有任何提示吗？谢谢！

Answer 1

只需传递对象即可分配如下属性：

http://jsfiddle.net/wLs8axLj/

JS

var app = angular.module('itemsApp',[]);

app.controller('ItemsCtrl',function($scope) {
    $scope.items = [
        {name:'Test 1',details:'Test 1 Details'},
        {name:'Test 2',details:'Test 2 Details'}
    ];

    $scope.showDetails = function(i) {
        $scope.item_details = i.details;
    };
});

HTML

<div ng-app="itemsApp" ng-controller="ItemsCtrl">
    <ul>
        <li ng-repeat="i in items" ng-click="showDetails(i)">{{i.name}}</li>
    </ul>
    <hr>
 {{item_details}}
</div>

如何在angularjs中使用ng-click显示ng-repeat的确切内容

1 个答案: