簡體   English   中英

在Angularjs中發布json對象

[英]post json object in Angularjs

我之前問過這個問題,但沒有得到答案。 我有一個表格,通過填充它創建json對象並發布到server.this表格重復幾次。 數據輸入表格可以重復多次。

<div ng-repeat="office in offices">
   <input type="text" ng-model="officeName">
   <input type="text" ng-model="office.employee">
   <input type="text" ng-model="office.employee">
   <button ng-click="addOffice()">Add New Office</button>
</div>

假設我的對象是

public class FormData{
   private List<Data> all;
}
public class Data{
  private String officeName;
  private List<Employee> list;
}
public class Employee{
  private String name;
}

如何創建json對象並綁定從表單獲取的數據綁定到該對象? 以及如何創建表單條目數據?(如何設置ng-model)

您可以執行以下操作:

 var app = angular.module('app', ['ngMockE2E']); app.controller('myController', function($scope, $http) { $scope.offices = []; $scope.addOffice = function() { $scope.offices.push({ employees: [] }); }; $scope.addEmployee = function(office) { office.employees.push({}); }; $scope.submitOffices = function() { $http.post('/offices', $scope.offices) .success(function() { // Handle success. }).error(function() { // Handle error. }); }; }); 
 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular-mocks.js"></script> <div ng-app='app' ng-controller='myController'> <button ng-click="addOffice()">Add New Office</button> <div ng-repeat="office in offices" ng-if="offices"> <form name="officesForm" novalidate ng-submit="submitOffices()"> Company Name: <input type="text" ng-model="office.name"> <div> Employees: <ng-form name="employeForm{{$index}}" ng-repeat="employee in office.employees"> <div> <input type="text" ng-model="employee.name"> </div> </ng-form> <button type="button" ng-click="addEmployee(office)">Add Employee</button> </div> <button type="submit">submit</button> </form> </div> <pre>{{ offices | json }}</pre> </div> 

裝有沙盒的iframe阻止了它的發布,因此它位於插銷上。

http://plnkr.co/edit/2eGVa3tg3TtIhFXNpUGI?p=preview

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM