从Angular 7发布的Laravel 5.7中未获取表单数据

时间:2019-01-29 12:46:08

标签: angular laravel angular2-forms

我正在使用Angular 7Laravel 5.7。我需要将数据从Angular发布到Laravel。

这是我的Angular 7代码,用于将数据发布到laravel api:

const target = event.target;
        const name = target.querySelector('#name').value;
        const phone = target.querySelector('#phone').value;
        const file = target.querySelector('#file').files[0];
        const httpOptions = {
            headers: new HttpHeaders({
                'Authorization' : 'Bearer ' +  Cookie.get('token'),
                'Content-type': 'multipart/form-data; charset=utf-8; boundary=' + Math.random().toString().substr(2)
            })
        };
       const input = new FormData();
        input.append('name', name);
        input.append('phone', phone);
        input.append('file', file);


        this.http.post(this.globvar.apipath + 'api/dpost/update/' + this.slug, input, httpOptions ).subscribe(
            data => {
console.log(data);

            },
            error => {}
        );

这是我的Laravel 5.7控制器代码:

static public function updatecarspa($slug, Request $request)
    {

        echo "<pre>";
        print_r($request->input('name'));
        echo "</pre>";
        exit;

       // $slug = $request->input('name');

        return response()->json(['data'=>$slug], 200);
    }

laravel没有打印错误<pre></pre>

我对angular并不陌生,我从angular到laravel都没有任何数据。请帮助我。

2 个答案:

答案 0 :(得分:0)

您的Angular代码没有问题。

尝试以下。

$inputs = Request::json()->all();
print_r($inputs['name']);

答案 1 :(得分:0)

好的,我得出结论

在Laravel 5.7与API你只能张贴JSON数据。因此,在我的角度余交Content-type与数据multipart/form-data,这样具有角Content-type需要改变application/json

所以随着角度的改变,我会改变:

 const input = {'name' : name, 'phone': phone, 'address' : address, 'pincode' : pincode, 'website' : website, image : this.is_uploded ? this.imagedata : ''};


    const httpOptions = {
        headers: new HttpHeaders({
            'Authorization' : 'Bearer ' +  Cookie.get('mmraccesstokenhope'),
            'Content-type': 'application/json; charset=utf-8; boundary=' + Math.random().toString().substr(2) + ';',
        })
    };

        this.http.post(this.globvar.apipath + 'api/dpost/update/' + this.slug, input, httpOptions ).subscribe(
            (data: any[]) => {
                this.Main.loading = false;
                alert('update Success');
                this.router.navigate(['/list/dpost']);

            },
            error => {}
        );

对于Image文件,您还需要将base64数据网址Sting发送到API服务器并保存图像。