相关疑难解决方法(0)

推动以ng-repeat角度渲染的表格中的行

当客户端点击该行时,我想在表中插入一行额外的行.数据不应该被预取,因为我预计最多有30行,但每行都有相关的数据,这些数据在一次获取中是不合理的.

到目前为止,我的方法是使用ng-repeat来迭代我的集合并渲染表格.当客户端按下该行时,客户端希望有关该行的详细信息在内联显示为按下的行下的额外行.

<tr ng-repeat="court in courts">            
  <td>{{court.name}}</td>
  <td>{{court.number}}</td>
  <td>{{court.nrOfPlayers}}</td>
  <td>
    <a href ng:click="toggle(court.number)">Details</a>  <!-- click toggles extra row with data loaded async -->
  </td>
</tr>
<!-- extra row here -->
Run Code Online (Sandbox Code Playgroud)

我已经成功地以一种黑客的方式展示了桌子底下的细节,但这不是我想要的.

你如何用angular.js实现这一目标?有角度的方法是什么?

这里有一个愚蠢的壁球场示例http://jsfiddle.net/HByEv/

angularjs ng-repeat

10
推荐指数
1
解决办法
9702
查看次数

如何使用指令在控制器上的元素上切换幻灯片动画?

我对以下情况感到困惑.假设我有一个带行的表.当用户单击表中的按钮时,我希望用户表单向下滑动jQuery并显示包含所选行值的表单.以下是我目前正在做的事情,这没有多大意义:

视图

<tr ng-click="setItemToEdit(item)" slide-down-form>
Run Code Online (Sandbox Code Playgroud)

...

<form>
   <input type="test" ng-model={{itemToEdit.Property1}} >
   <button ng-click=saveEditedItem(item)" slide-up-form>
<form>
Run Code Online (Sandbox Code Playgroud)

控制

$scope.itemToEdit = {};

$scope.setItemToEdit = function(item) {
    $scope.itemToEdit = item;
});

$scope.saveEditedItem = function(item) {
   myService.add(item);
   $scope.itemToEdit = {};
}
Run Code Online (Sandbox Code Playgroud)

指令 - 上滑/下滑

var linker = function(scope, element, attrs) {
    $(form).slideUp(); //or slide down           
}
Run Code Online (Sandbox Code Playgroud)

似乎我的指令和我的控制逻辑太过断开了.例如,如果存在保存错误会发生什么?表单已隐藏,因为slideUp事件已完成.在这种情况下,我很可能想要阻止slideUp操作.

我只使用AngularJS大约一个星期,所以我确信有些东西我不见了.

angularjs

5
推荐指数
1
解决办法
4205
查看次数

标签 统计

angularjs ×2

ng-repeat ×1