javascript - 如何将带有数组的表单值传递给 Angular Controller

Question

我有一个功能来选择文档并添加该文档类型的文件。 我无法将该值发送到 Controller 。

实际上我正在使用向表单添加新功能。所以我将其命名为数组并尝试发送详细信息。但我在这里没有得到详细信息。

仅供引用，我正在使用 codeigniter 编写服务器脚本。

谁能帮帮我。

这是我的 View 文件checklist.php。

    <div ng-controller="checklist">

<div class="row">
<div class="col-xs-12">
<!-- PAGE CONTENT BEGINS -->
<form class="form-horizontal" role="form" name="checkForm" action="#/customer/adddocument"  novalidate>


<a id="button" onlick="duplicate()">Click me</a>

<div id="duplicater"> 
<div class="row">   
<div class="form-group col-md-6" ng-controller="documentController" >
<label class="col-sm-3 control-label no-padding-right">Documents</label>
<div class="col-sm-9">
<select class="form-control" name="document[]" required ng-model = "checklist.document[]">
<option value="">Select document</option>
<option ng-repeat="option in documentsList.data" value="{{option.AGENT_ID}}">{{option.AGENT_NAME}}</option>
</select>
</div>
</div>

<div class="col-md-6">
<input type="file" name="file" />
</div>

</div>
</div>

<script>
document.getElementById('button').onclick = duplicate;
var i = 0;
var original = document.getElementById('duplicater');

function duplicate() {
var clone = original.cloneNode(true); // "deep" clone
// clone.id = "duplicetor" + ++i; // there can only be one element with an ID
original.parentNode.appendChild(clone);
}
</script>


<div class="modal-footer" >
<button ng-show="sub" ng-click="submit(checklist)" ng-disabled="checkForm.$invalid" class="btn btn-sm btn-primary">
<i class="ace-icon fa fa-check"></i>
Save
</button>

<button ng-show="edt" ng-click="update(checklist)" ng-disabled="checkForm.$invalid" class="btn btn-sm btn-primary">
<i class="ace-icon fa fa-check"></i>
Edit
</button>
<button ng-show="edt" ng-click="cancel()"  class="btn btn-sm btn-primary">
<i class="ace-icon fa fa-check"></i>
Cancel
</button>
</div>


<input type="submit" name="submit">


</form>

这是我的 Controller 文件checklist.js。

project.controller('checklist', ['$scope', '$http', 'services', '$location', 'uiGridConstants', '$timeout','$interval','$q','$rootScope','$filter', function($scope, $http, services,  $location,  uiGridConstants, $timeout,$interval,$q,$rootScope,$filter,uibDateParser) {


$rootScope.$broadcast("globalgrid",{'displaycolumns': discolumns, 'gridservice':gridservice , 'grid_service_param':grid_service_param });//,'gridload':func_name, 'addnew': "Submit"
//$scope.selectedDate = Date();
$scope.sub = true;
$scope.edt = false;
$scope.uploadfiles = "";
console.log($scope.date);

$scope.custsub = function(e){
 var fd = new FormData();
    fd.append('file', $scope.uploadfiles);
        var f = $scope.uploadfiles;
        console.log(f); 
        console.log(e);
        services.addCustomerinfo(res.data,e.icno,e.customername);
        $rootScope.submit(submitfun);
    });

}

在 Controller 中，当我检查控制台时，我没有得到任何东西。 谁能帮帮我。

Answer 1

1.) 您需要创建一个 rest api，它从表单返回您发布的数据，
2.) 创建一个从该 api 发出请求的 Angular 服务，
3.) 在您的 Controller 中包含该服务并发送检索到的数据以供查看。