Angularjs -从输入文本ng-model填充json数组

angularjs - populating json array from input text ng-model

本文关键字：填充 json 数组 ng-model 文本 输入 Angularjs      更新时间：2023-09-26

我有一个表单，我想把它的数据发送到json格式的后端。我遇到的问题是，一些表单字段应该填充一个数组。

表格的简短版本(使用玉模板): 

div(ng-controller="NewProposalController as newProposal")
    form(name="form", method="POST")
        div
           label Project: 
           input(type="text", ng-model="proposal.project")
        div
           label Contact name:
           input(type="text", ng-model="proposal.contacts[0].name")
           label email:
           input(type="text", ng-model="proposal.contacts[0].email")
        div
           label Contact name:
           input(type="text", ng-model="proposal.contacts[1].name")
           label email:
           input(type="text", ng-model="proposal.contacts[1].email")
        button(ng-click="create(proposal)") Save

控制器的简写版本

App.controller('NewProposalController', ['$http', '$scope', '$window',
    function($http, $scope, $window) {
        $scope.master = {};
        $scope.create = function(proposal) {
            $scope.master = angular.copy(proposal);
            $http.post('/proposals/proposal/create', $scope.master)
                    .success(function(data, status, headers, config) {
                        $window.location.href = headers('redirectURL');
                    });
        };
    }]);

期望发送到服务器的json 

{
    "project":"Some project name",
    "contacts":[
                  {
                      "name":"John",
                      "email":"john@abc.com"
                  },{
                      "name":"Paul",
                      "email":"paul@abc.com"
                  }
               ]
}

然而，当我按下"保存"按钮时，我得到以下错误:TypeError: Cannot read property 'name' of undefined

我如何让我的联系人输入文本填充json属性作为一个数组?

在这种情况下，您需要从控制器初始化提案对象:

$scope.master = {};
$scope.proposal = {
    contacts: [
        {
            name: "",
            email: ""
        },
        {
            name: "",
            email: ""
        }
    ]
};
相关文章：