從NG-重複多個容器中

顯示JSON數據嘿，我有一個關於使用NG-重複的問題。我試圖在兩個單獨的容器中顯示來自大型json文件的用戶數據。當用戶點擊一行時，它會在另一部分顯示ng-repeat的另一部分。如果有人可以看看這個小提琴，也許給我一個方向，那將是非常棒的。謝謝！從NG-重複多個容器中

我還使用ngTable爲表參數，可以，但我不認爲這有很大的關係這一問題。

http://jsfiddle.net/cL5aE/1/

HTML：

<body> 
    <div ng-controller="myController"> 
    <div class="col-md-6"> 
     <table> 
      <tr ng-repeat="user in $data" ng-click="loadDetails()"> 
       <td>{{user.name}}</td> 
       <td>{{user.id}}</td> 
      </tr> 
     </table> 
    </div> 
    <div class="col-md-6"> 
     <tr ng-repeat="user in $data" ng-show="loadDetails()"> 
      <td>{{user.foo}}</td> 
      <td>{{user.bar}}</td> 
     </tr> 
    </div> 
    </div> 
</body>

控制器：

angular.module('app', ['ngTable']); 


app.controller('myController', function ($scope, $http, ngTableParams) { 

$http.get('http://myjson.com/data.json') 
    .success(function (data, status) { 

    $scope.tableParams = new ngTableParams({ 
     page: 1, // show first page 
     count: 10, // count per page 
     sorting: { 
      CompleteDate: 'asc' // initial sorting 
     } 
    }, { 
     total: data.length, // length of data 
     getData: function ($defer, params) { 
      // use build-in angular filter 
      var orderedData = params.sorting() ? $filter('orderBy')(data, params.orderBy()) : data; 

      $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
     } 

    }); 

}); 

    $scope.loadDetails = function(data) { 
    //??? 
    } 


});

來源

2014-02-26 jacoStillLives

我會通過用戶對象作爲參數的函數，並分配給它一個模型。這樣你就不需要在兩個部分都使用ng-repeat，這樣可以得到更清晰，更易讀的代碼。

傳遞你的NG-重複顯示的對象：

<tr ng-repeat="user in $data" ng-click="loadDetails(user)">

功能對象加載到一個模型屬性：

$scope.loadDetails = function(user) { 
    $scope.viewModel.selectedUser = user; 
}

最後的模型屬性分配給視圖：

<table> 
    <tr ng-show="viewModel.selectedUser"> 
    <td>{{viewModel.selectedUser.foo}}</td> 
    <td>{{viewModel.selectedUser.bar}}</td> 
    </tr> 
</table>

http://jsfiddle.net/jimenezjrs/5Cd32/

來源

2014-02-26 20:35:23 user3357652

是的，這是正確的！謝謝 – jacoStillLives

@jacoStillLives，你可以發佈你正在使用這個你JSON的例子摘錄？ –

從NG-重複多個容器中

回答

相關問題