Question

我尝试使用angular-material将表单中的捕获数据存储在对象中，并将对象框与要捕获的表单一起存储。

控制器的相关部分看起来像

  $scope.attendees = [{
    firstName: "",
    lastName: "",
    email: "",
    phone: ""
   }];  

$scope.addAttendee = function(ev) {
$mdDialog.show({
controller: DialogController,
templateUrl: 'views/regForm.tmpl.html',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose:true,
fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
})
};

    function DialogController($scope, $mdDialog) {
                $scope.hide = function() {
                  $mdDialog.hide();
                };

                $scope.cancel = function() {
                  $mdDialog.cancel();
                };

                $scope.saveAttendee = function(attendee) {

                  str = JSON.stringify(attendee, null, 4);
                  $mdDialog.hide(attendee);

                  console.log('Attendee ' + str);

                  $scope.attendees.push(attendee);

                  console.log('Attendees ' + $scope.attendees);
                };
              }

Attendee的输出是正确的，但后来它在push(attendee)上崩溃为Cannot read property 'push' of undefined或push将覆盖添加的先前数据（基于给定的答案）

有关于此的任何提示吗？

Answer 1

只需移动控制器内的$scope.attendees即可。

function DialogController($scope, $mdDialog) {

$scope.attendees = [{
 firstName: "",
 lastName: "",
 email: "",
 phone: ""
}];     

$scope.hide = function() {
  $mdDialog.hide();
};

$scope.cancel = function() {
  $mdDialog.cancel();
};

$scope.saveAttendee = function(attendee) {

  str = JSON.stringify(attendee, null, 4);
  $mdDialog.hide(attendee);

  console.log('Attendee ' + str);

  $scope.attendees.push(attendee);

  console.log('Attendees ' + $scope.attendees);
};
}

你所说的从调用mdDialog的控制器发送数据，这是一个带有基本示例的plnkr。 example plnkr

修改的cour代码应该是。

function DialogController($scope, $mdDialog, attendees) {
    $scope.attendees = attendees;
    $scope.hide = function() {
      $mdDialog.hide();
    };
    $scope.cancel = function() {
      $mdDialog.cancel();
    };
    $scope.saveAttendee = function(attendee) {
      str = JSON.stringify(attendee, null, 4);
      $mdDialog.hide(attendee);
      console.log('Attendee ' + str);
      $scope.attendees.push(attendee);
      console.log('Attendees ' + $scope.attendees);
    };
  }

并在调用示例的控制器中

$modal.show({
 // configuration like you have.
}).then(function(response){
   //when hide the modal
   $scope.attendees = response;
});

检查是否有这个帮助。

Answer 2

如果有人需要“固定”代码，对话框控制器位于

之下

    var attendee = this;
    attendees = [];

    $scope.addAttendee = function(ev) {
        $mdDialog.show({
        controller: DialogController,
        templateUrl: 'views/regForm.tmpl.html',
        parent: angular.element(document.body),
        targetEvent: ev,
        clickOutsideToClose:true,
        controllerAs: 'attendee',
        fullscreen: $scope.customFullscreen, // Only for -xs, -sm breakpoints.
        locals: {parent: $scope}
    })
    .then(function(response){
        attendees.push(response);

        console.log(attendees);
        console.log(attendees.length);
    })
  };

    function DialogController($scope, $mdDialog) {

        var attendee = this;

        $scope.hide = function() {
            $mdDialog.hide();
        };

        $scope.cancel = function() {
            $mdDialog.cancel();
        };

        $scope.save = function(response) {
            $mdDialog.hide(response);
        };
    }

AngularJS：无法将数据存储到对象

2 个答案: