单击时确定ng-repeat项目

Question

嗨，我是离子即兴创作中使用角度的ng-repeat ...我想知道如何在点击ng-repeat项目时获取名称或id。我使用sqlite获取所有数据。

   function UserCtrl($scope, $cordovaSQLite, $location, $state, $cordovaDialogs, $cordovaPreferences) {
        var vm = this;

        $scope.data = {};
        $scope.selection = {catagory : null};
        var query = "SELECT * FROM listpeople";
        $cordovaSQLite.execute(db, query, [])
            .then(function(res) {
                if (res.rows.length > 0) {

                    var userName = _.map(res.rows, 'name');
                    vm.names = userName;

                    console.log(userName)


                } else {
                    console.log("No results found");
                    console.log(res);
                }
            }, function(err) {
                console.error(err);
            });

} 

我的HTML

<ion-view title="Users" ng-controller="UserCtrl as vm">
    <ion-content class="has-header padding">
        <div class="list">
            <div class="item item-icon-right" ng-repeat="users in vm.names track by $index">
                {{users}}
                <i class="icon ion-edit" ng-click = "vm.edit()"></i>
            </div>
        </div>
    </ion-content>
</ion-view>

Answer 1

只需将users作为函数

的参数传递

 <i class="icon ion-edit" ng-click = "vm.edit(users)"></i>

控制器：

vm.edit = function(users){
    console.log(users)
}

Answer 2

你可以：

1. 从HTML
传递该特定项目

HTML：

<div class="item item-icon-right" ng-repeat="users in vm.names track by $index">
     {{users}}
     <i class="icon ion-edit" ng-click = "vm.edit(users)"></i>
</div>

JS：

function UserCtrl($scope, $cordovaSQLite, $location, $state, $cordovaDialogs, $cordovaPreferences) {
            var vm = this;
            var vm.edit = function(item){
                //update your item here
            }
            $scope.data = {};
            $scope.selection = {catagory : null};
            var query = "SELECT * FROM listpeople";
            $cordovaSQLite.execute(db, query, [])
                .then(function(res) {
                    if (res.rows.length > 0) {

                        var userName = _.map(res.rows, 'name');
                        vm.names = userName;

                        console.log(userName)


                    } else {
                        console.log("No results found");
                        console.log(res);
                    }
                }, function(err) {
                    console.error(err);
                });

}

1. 从HTML
传递该项$index的索引

HTML：

<div class="item item-icon-right" ng-repeat="users in vm.names track by $index">
     {{users}}
     <i class="icon ion-edit" ng-click = "vm.edit($index)"></i>
</div>

JS：

function UserCtrl($scope, $cordovaSQLite, $location, $state, $cordovaDialogs, $cordovaPreferences) {
            var vm = this;
            var vm.edit = function(index){
               var itemToUpdate = vm.names[index];
               //update your item here
            }
            $scope.data = {};
            $scope.selection = {catagory : null};
            var query = "SELECT * FROM listpeople";
            $cordovaSQLite.execute(db, query, [])
                .then(function(res) {
                    if (res.rows.length > 0) {

                        var userName = _.map(res.rows, 'name');
                        vm.names = userName;

                        console.log(userName)


                    } else {
                        console.log("No results found");
                        console.log(res);
                    }
                }, function(err) {
                    console.error(err);
                });

}

在这两种情况下，您的vm.names数组都会有更新后的值，请在此修改后单击