Question

我是Angular的新手，想要在点击另一个div时简单地移动一个元素。最好的方法是如何做到的？

<div ng-app>
    <h1>First area</h1>
    <ul>
        <li ng-repeat="elem in elems">
            {{ elem.elem_name }}
        </li>
    </ul>
    <h1>Second Area</h1>
    <ul>
        <li>

        </li>
    </ul>
</div>

所以在我的JS文件中给出了一个例子，当我点击一个elem它离开第一个区域并出现在第二个区域时，我该怎么做呢？

Answer 1

我对Angular.js知之甚少，但如果做到这一点的方法没有涉及为“第二区”添加一组新的元素，我会感到惊讶：

<h1>Second Area</h1>
<ul>
     <li ng-repeat="elem in secondElems">
         {{ elem.elem_name }}
     </li>
</ul>

然后以编程方式从elems中删除点击的元素并将其放入secondElems。

Answer 2

为每个项目添加selected属性，并在单击时切换它。使用filter根据selected ...

过滤每个列表

$scope.items = [{name: "foo", selected: false},
                {name: "bar", selected: false},
                {name: "baz", selected: false},
                {name: "quux", selected: false}];

$scope.move = function(item) {
    item.selected = !item.selected;
};

查看

List 1
<ul>
  <li ng-repeat="item in items | filter : {selected: false}">
    {{ item.name }}
    <a href="#" ng-click="move(item)">move</a>
  </li>
</ul>

List 2
<ul>
  <li ng-repeat="item in items | filter : {selected: true}">
    {{ item.name }}
    <a href="#" ng-click="move(item)">move</a>
  </li>
</ul>

JsBin：http://jsbin.com/sawotuza/1/edit?html,js,output

删除元素，在别处替换元素

2 个答案: