首页 文章

从表格angularjs和laravel保存数据和文件

提问于
浏览
0

我想从数据库中的表格AngularJS保存数据 . 我有字段的形式 . 但我想另外发送带有数据的文件 . 数据发送没有问题 . 但我不知道如何发送文件与数据 . 我必须发两个请求吗?如何将文件与数据一起发送?

这是我的输入文件 .

<div class="pure-control-group">
                    <label for="code">UID</label>
                    <input id="uid" ng-model="form.uid" type="text" placeholder="UID" required="" disabled="">
                </div>

            <div class="pure-control-group">
                <label for="code">Code</label>
                <input id="code" ng-model="form.code" type="text" placeholder="Code" required="">
            </div>

            <div class="pure-control-group">
                <label for="name">Name</label>
                <input id="name" ng-model="form.name" type="text" placeholder="Name" required="" autocomplete="new-password">                             
            </div>

            <div class="pure-control-group">
                <label for="town">Town</label>
                <input id="town" ng-model="form.town" type="text" placeholder="Town" required="" autocomplete="new-password">                             
            </div>

            <div class="pure-control-group">
                <label for="date_start">Date Start</label>
                <input id="date_start" ng-model="form.date_start" type="date" placeholder="Password" autocomplete="new-password">
            </div>

            <div class="pure-control-group">
                <label for="date_stop">Date Stop</label>
                <input id="date_stop" ng-model="form.date_stop" type="date" placeholder="Password" autocomplete="new-password">
            </div>

            <div class="pure-control-group">
                <label>Status</label>
                <select class="form-control select" ng-model="form.status">
                    <option ng-repeat="status in statuses" value="{{status.name}}">{{status.name}}</option>
                </select>
            </div>
<div class="pure-control-group">
                        <label for="logo">Logo</label>
                        <input id="logo" type="file" ng-model="form.logo" name="file" accept="image/*" ngf-max-size="5MB" required>
                    </div>

Angularjs控制器:

$scope.submit = function (data)
                {     
                        $fetch.post('api/admin/places', data)
                                .then(function (response)
                                {
                                    if (response.success)
                                    {
                                        Notification.success(response.message);
                                        $state.go('app.admin.places');
                                    } else
                                    {
                                        var msg = response && response.message ? response.message : 'There was an error in data update. Please contact your administrator';
                                        Notification.error(msg);
                                    }
                                })
                                .finally(function () {
                                    $loader.hide();
                                });
                    }
                };

Laravel控制器:

public function add(Request $request) {

        try {

            Place::create([
                'uid' => Uuid::generate()->string,
                'code' => $request->input('code'),
                'name' => $request->input('name'),
                'town' => $request->input('town'),
                'date_start' => $request->input('date_start'),
                'date_stop' => $request->input('date_stop'),
                'status' => $request->input('status'),
                'sort' => 1,
                'position' => $request->input('position'),
            ]);
        } catch (\Exception $ex) {

        }
        return ['success' => true, 'message' => 'Place was successfully added'];
    }

那么,如何将文件与数据一起保存?

1 回答

  • 0

    使用以下代码通过$ post将文件上传到服务器: -

    myApp.service('fileUpload', ['$http', function ($http) {
        this.uploadFileToUrl = function(file, uploadUrl){
            var fd = new FormData();
            fd.append('file', file);
    
            var info = {
                "text":"additional info"
            };
            fd.append('data', angular.toJson(info));
    
            $http.post(uploadUrl, fd, {
                 transformRequest: angular.identity,
                 headers: {'Content-Type': undefined}
            })
    
            .success(function(){
            })
    
            .error(function(){
            });
        }
    }]);
    

    希望你知道剩下的部分 .

相关问题