Question

拥有管理界面 - 可以添加\ delete \ edit用户。这是html的一部分，没什么重要的，但可以肯定（ng-controller和ng-app包含在我的索引文件中）。

<div class="row" ng-repeat="user in users">
            <form name="myForm2">
                <div class="col-md-1 cell">
                    <span ng-show="!editMode">{{user.username}}</span>
                    <input ng-show="editMode" type="text" name="username" ng-model="current.username" required >
                </div>
                <div class="col-md-1 cell">
                    <span ng-show="!editMode">{{user.firstname}}</span>
                    <input ng-show="editMode" type="text" name="firstname" ng-model="current.firstname" required>
                </div>
                <div class="col-md-1 cell">
                    <span ng-show="!editMode">{{user.lastname}}</span>
                    <input ng-show="editMode" type="text" name="lastname" ng-model="current.lastname" required>
                </div>
                <div class="col-md-1 cell">
                    <span ng-show="!editMode">{{user.age}}</span>
                    <input ng-show="editMode" type="number" name="age" ng-model="current.age" required>
                </div>
                <div class="col-md-2 cell">
                    <span ng-show="!editMode">{{user.email}}</span>
                    <input ng-show="editMode" type="email" name="email" ng-model="current.email" required>
                </div>
            </form>
            <div class="col-md-3 cell">
                <button type="button" class="btn btn-warning" ng-show="!button1" ng-click="edit(user); userEddit = !userEddit; button1 = !button1; editMode = !editMode">Eddit</button>
                <span ng-show="userEddit">
                    <h6>Save changes?<br>
                        <button type="submit" class="btn btn-success btn-xs col-md-offset-1" ng-click="save(user); userEddit = !userEddit; button1 = !button1; editMode = !editMode" ng-disabled="myForm2.$invalid">Save</button>
                        <button type="button" class="btn btn-danger btn-xs col-md-offset-1" ng-click="cancel(user); userEddit = !userEddit; button1 = !button1; editMode = !editMode">Cancel</button>
                    </h6>   
                </span>
            </div>
            <div class="col-md-3 cell">
                <button type="button" class="btn btn-danger" ng-show="!button" ng-click="userDelete = !userDelete; button = !button">Del</button>
                <span ng-show="userDelete">
                    <h6>Sure?
                        <button type="submit" class="btn btn-success btn-xs col-md-offset-1" ng-click="removeRow(user.username)">Del</button>
                        <button type="button" class="btn btn-danger btn-xs col-md-offset-1" ng-click="userDelete = !userDelete; button = !button">Cancel</button>
                    </h6>   
                </span>
            </div>
        </div>

有controllers.js

'use strict';
var App = angular.module('App', []);
App.controller('ListCtrl', function($scope) {
    $scope.users = [
    {"username":"user1","firstname":"John","lastname":"Anderson","age":25,"email":"john.anderson@testtask.com"},
    {"username":"user2","firstname":"Paul","lastname":"Winfred","age":27,"email":"winfredMPaul@dayrep.com"},
    {"username":"user3","firstname":"Adan","lastname":"Kelley","age":64,"email":"adanMKelley@jourrapide.com"},
    {"username":"user4","firstname":"Vernon","lastname":"McCall","age":70,"email":"vernonKMcCall@teleworm.us"},
    {"username":"user5","firstname":"Ernest","lastname":"Heflin","age":38,"email":"ernestMHeflin@jourrapide.com"},
    {"username":"user6","firstname":"John","lastname":"Barton","age":52,"email":"JohnPBarton@jourrapide.com"},
    {"username":"user7","firstname":"Jessica","lastname":"Lara","age":25,"email":"JessicaRLara@jourrapide.com"}
    ];

$scope.removeRow = function(username){              
    var index = -1;     
    var comArr = eval( $scope.users );
    for( var i = 0; i < comArr.length; i++ ) {
        if( comArr[i].username === username ) {
            index = i;
            break;
        }
    }
    if( index === -1 ) {
        alert( "Something gone wrong" );
    }
    $scope.users.splice( index, 1 );        
};  

$scope.current = {};
$scope.copy = {};

$scope.edit = function(user){
    $scope.copy = angular.copy(user);
    $scope.current = angular.copy(user);    
};

$scope.save = function(user){
    user = $scope.current;
    $scope.current = {};
    $scope.copy = {};
};

$scope.cancel = function(user) {
    user = $scope.copy;
    $scope.current = {};
    $scope.copy = {};
};
});

我的问题 - 我无法保存更改。但如果我这样做

$scope.edit = function(user){
        $scope.copy = angular.copy(user);
        $scope.current = angular.copy(user);    
    };

    $scope.save = function(user){
        $scope.users[0] = $scope.current;
        $scope.current = {};
        $scope.copy = {};
    };

    $scope.cancel = function(user) {
        $scope.users[0] = $scope.copy;
        $scope.current = {};
        $scope.copy = {};
    };

它只适用于第一个。

Answer 1

这是问题所在。我认为你的所有方法都有问题，例如你可以使用它来保存：

user = $scope.current;

这会将您的用户添加到用户数组。

Answer 2

找到答案：只为我的数据库创建id

    for (var i = 0; i < $scope.users.length; i++) {
    $scope.users[i].id = i;
    }

然后只检查周期中的匹配

$scope.edit = function(user){
    $scope.copy = angular.copy(user);
    $scope.current = angular.copy(user);    
};

$scope.save = function(user){
    for (var i = 0; i < $scope.users.length; i++) {
        if ($scope.users[i].id === $scope.current.id){
            $scope.users[i]=$scope.current;
        }
    }
    $scope.current = {};
    $scope.copy = {};
};

$scope.cancel = function(user) {
    for (var i = 0; i < $scope.users.length; i++) {
        if ($scope.users[i].id === $scope.copy.id){
            $scope.users[i]=$scope.copy;
        }
    }
    $scope.current = {};
    $scope.copy = {};
};

非常感谢

angular-js无法保存更改

2 个答案: