我在angularjs中创建了一个应用程序,希望在其中将listbox1的值添加到listbox2。
当我点击任何li选项卡时,我得到了该li的值,但是当我试图将该值推入其他列表框时,它不会显示出来。
请帮帮我。。
先端的Thanx
链接:-http://plnkr.co/edit/jZeeyFmjIlcsasyL9CzC?p=preview

var App = angular.module('myApp', ['ngDragDrop']);
App.controller('OverviewCtrl', function ($scope) {
    $scope.list2 = [
        {'title': 'Item 1'},
        {'title': 'Item 2'},
        {'title': 'Item 7'},
        {'title': 'Item 8'}
    ];
    $scope.list1 = [
        {'title': 'Item 1'},
        {'title': 'Item 2'},
        {'title': 'Item 3'},
        {'title': 'Item 4'},
        {'title': 'Item 5'},
        {'title': 'Item 6'},
        {'title': 'Item 7'},
        {'title': 'Item 8'}
    ];
    $scope.toggle = function(test,$scope){
       // alert(test)
        $scope.list2.push($scope.list2.title.test);
    }
});

HTML代码:-
 <div class="row" ng-controller="OverviewCtrl">
    <div class="col-md-5" >
        <div class="panel panel-default">
            <div class="panel-heading"><h4>List 1</h4></div>
            <div class="panel-body">
                <ul class="list-group">
                    <li class="list-group-item" ng-repeat="item in list1" ng-click="toggle(item.title)" >{{item.title}}</li>
                </ul>
            </div>
        </div>

    </div>
    <div class="col-md-2" style="text-align: center">
        <button type="button" class="btn btn-success"  style="margin-top: 70px; margin-bottom: 10px">
            <span class="glyphicon glyphicon-triangle-right btn-sm" aria-hidden="true"></span>
        </button>
        </br>
        <button type="button" class="btn btn-success"  style="margin-top: 10px; margin-bottom: 10px">
            <span class="glyphicon glyphicon-triangle-left btn-sm" aria-hidden="true"></span>
        </button>
    </div>
    <div class="col-md-5">
        <div class="panel panel-default">
            <div class="panel-heading"><h4>List 2</h4></div>
            <div class="panel-body">
                <ul class="list-group">
                   <li class="list-group-item" ng-repeat="item in list2" >{{item.title}}</li>
                </ul>
            </div>
        </div>
    </div>
</div>

最佳答案

它不起作用,因为您没有复制列表中的对象。
list2.title没有意义,因为list2是一个数组。这样更合理:

$scope.toggle = function(item){
    $scope.list2.push(item);
}

并将调用toggle的方式更改为:
ng-click="toggle(item)"

另一方面,我必须指出,toggle只是添加到list2中,而不是从list1中删除,这可能不是您想要的行为。

09-19 14:27