angularjs:同时节省多个学生

时间:2016-05-29 09:35:41

标签: javascript angularjs

我正在努力保存当时的学生人数,我写了下面的代码,但我不知道该往哪里走。任何关于此主题的资源或资源链接将不胜感激 到目前为止我做了什么:

<div ng-controller="MainCtrl">
    <fieldset data-ng-repeat="student in students"> 
        <input type="text" ng-model="student.class" name="" placeholder="Class Name ">                
        <input type="text" ng-model="student.firstname" name="" placeholder="First Name ">
        <input type="text" ng-model="student.lastname" name="" placeholder="Last Name ">
        <button class="btn btn-danger" ng-show="$last" ng-click="removeStudent()">-</button>
    </fieldset>

    <button class="btn btn-primary" ng-click="addNewStudent()">New Student</button>
    <button class="btn btn-primary" ng-click="save()">Save</button>
    <button class="btn btn-warning" ng-click="cancel()">Cancel</button>                
 </div> 

控制器是:

app.controller('MainCtrl', function($scope, $modalInstance, $students) {
    $scope.students = [];

    $scope.addNewStudent = function() {
        $scope.students.push({
            classname: "",
            firstname: "",
            lastname: ""
        });
    };
    $scope.removeStudent = function() {
        var lastItem = $scope.students.length - 1;
        $scope.students.splice(lastItem);
    };

    $scope.save = function() {
        $modalInstance.close($scope.students);
    };

    $scope.delete = function() {
        $scope.students['deleted'] = 1;
        $modalInstance.close($scope.students);
    };

    $scope.cancel = function() {
        $modalInstance.dismiss('cancel');
    };
});

在视图中我可以写出学生的信息但是当我点击保存按钮时它只保存第一个学生

模态实例:

    $scope.openStudent = function (student) {

    var modalInstance = $modal.open({
        templateUrl: 'modalStudent.html',
        controller: 'mainCTRL',
        windowClass:'app-modal-window',
        resolve: {
            students: function () {
                var students= {};

                if (student !== undefined){
                    students['classname'] = student.classname; 
                    students['firstname'] = student.firstname ; 
                    students['lastname'] = student.lastname; 
                    students['nachname'] = student.nachname; 

                }
                console.log("studinfo",students);
                return students;
            }
        }
    });

    modalInstance.result.then(function (students) {

        if (students.deleted  === undefined || students.deleted == 0) { 
            oStudent = { classname: students.classname, 
                        firstname: students.firstname, 
                        lastname: students.lastname,
                        delete_time:"0000-00-00 00:00:00"
                        };

            saveStudent( $indexedDB,Student).then( function(id) {
                $scope.buildMenu();
            });
        } else {
             oStudent = { id: students.id,
                        delete_time:new Date().toISOString()
                        };
            deleteStudent( $indexedDB, $scope, students.id).then( function(id) {
                saveStudent( $indexedDB, Student, $scope.selectedUser.id ).then( function(id) {
                $scope.buildMenu();
            });
            });
        }
    }, function () {
        //console.log('Modal Student dismissed at: ' + new Date());
    });
}

1 个答案:

答案 0 :(得分:0)

如果是传递现有学生对象的模态,则应将控制器代码修改为:

此外,在这种情况下,您应该使用两个单独的视图进行添加和编辑,以避免代码混乱。因为在添加的情况下,学生将是一个对象数组,如果是编辑,它将是一个单独的对象,你不能使用ng-repeat,因为它不会工作

app.controller('MainCtrl', function($scope, $modalInstance, students) {

    //students variable contains information about the student to be edited, so your code should be something like this
    if(students.classname !== undefined){
         $scope.students = students;   
    }else{
         $scope.students = [];
    }

//而不是每次模态被打开时重新初始化你应该保留你传递的学生的价值

    $scope.addNewStudent = function() {
        $scope.students.push({
            classname: "",
            firstname: "",
            lastname: ""
        });
    };
    $scope.removeStudent = function() {
        var lastItem = $scope.students.length - 1;
        $scope.students.splice(lastItem);
    };

     $scope.save = function() {
        $modalInstance.close($scope.students);
         //make sure to save this when modal closes in the variable you are returning students from when modal is triggered
    };

    $scope.delete = function() {
        $scope.info['deleted'] = 1;
        $modalInstance.close($scope.students);
    };

    $scope.cancel = function() {
        $modalInstance.dismiss('cancel');
    };
});