Question

我有一个具有以下结构的小部件（它是一个“计划选择器”简历）：

<div>
  <ul>
    <li resume="to" ng-repeat="item in items"></li>
  </ul>
  <div class="total"></div>
  <ul>
    <li resume="from" ng-repeat="item in items"></li>
  </ul>
</div>

我的指令如下：

plans.directive('resume', function() {
  return {
    restrict: 'A',
    template: '<h3>{{step.name}}</h3><div>{{val}}</div>',
    link: function($scope, element, attrs, controller) {}
  };
});

注意：

plans是angular.module('Plans')
items是通过AJAX加载的一些数据，每个项目都有selected属性
他们与将要选择的项目共享相同的控制器，即PlansCtrl

我想要的是什么：

当用户完成选择项目（设置每个“已选择”）时，它将仅在选择时显示在“到”中，并且仅在未选中时显示在“从”中。我不想硬编码任何东西，因为所有内容都是使用AJAX安装的。

Answer 1

假设我理解你是正确的，那么使用the filter filter可能更好：

http://jsfiddle.net/qbGeG/

<div ng-app ng-controller="x">
    <b>selected</b>
    <ul>
        <li ng-repeat="item in items | filter:{selected:true}" ng-click="item.selected = !item.selected">{{item.name}}</li>
    </ul>
    <div class="total"></div>
    <b>unselected</b>
    <ul>
        <li ng-repeat="item in items | filter:{selected:!true}" ng-click="item.selected = !item.selected">{{item.name}}</li>
    </ul>
</div>

如果您需要将该功能作为指令，那么最好将整个li元素替换为：<selectableList source="items" />，其中您的指令只使用filter和{{1就像我上面做的那样。

使用AngularJs从指令转移指令的最佳方法是什么？

1 个答案: