Как отобразить сохраненные данные в базе данных после отправки с помощью Angular-7 - PullRequest
0 голосов
/ 06 ноября 2019

Я работаю над веб-порталом, использующим Angular-7 в качестве внешнего интерфейса и Laravel-5.8 в качестве внутреннего. Код ниже является запросом POST. Он отправляется в базу данных.

QuoteController.php

public function createClientQuote(Request $request) {
        $request->validate([
                    'first_name' => 'required',
                    'last_name' => 'required',
                    'email' => 'required|email',
                    'phone' => 'required|max:14',
                    'business_name' => 'string',
                    'truck_type' => 'required',
                    'truck_required' => 'required',
                    'quote_origin' => 'required',
                    'quote_destination' => 'required',
                    'commodity' => 'required',  
                    'loading_date' => 'date|required' 
        ]);
        $clientquote = new ClientQuote;
        $clientquote->first_name=$request->get('first_name');
        $clientquote->last_name=$request->get('last_name');
        $clientquote->email=$request->get('email');
        $clientquote->phone=$request->get('phone');
        $clientquote->business_name=$request->get('business_name');
        $clientquote->truck_type=$request->get('truck_type');
        $clientquote->truck_required=$request->get('truck_required');
        $clientquote->quote_origin=$request->get('quote_origin');
        $clientquote->quote_destination=$request->get('quote_destination');
        $clientquote->commodity=$request->get('commodity');
        $loading_date=date_create($request->get('loading_date'));
        $format = date_format($loading_date,"Y-m-d H:i:s");
        $clientquote->loading_date = $format;
        $clientquote->save();

        return response()->json([
            'message' => 'Quote Successfully Sent!','data' =>  $clientquote
        ], 201);
}

api.php

Route::group([
], function () {
    Route::post('quote','QuoteController@createClientQuote');
})

Угловой

quote.component.ts

import { Component, OnInit, ElementRef, NgZone, ViewChild } from '@angular/core';
import { ApiService } from '../../shared/services/api.service';
import { TokenService } from '../../shared/services/token.service';
import { Router } from '@angular/router';
import { SnotifyService } from 'ng-snotify';


@Component({
  selector: 'app-client-quotes-landing',
  templateUrl: './client-quotes-landing.component.html',
  styleUrls: ['./client-quotes-landing.component.scss']
})
export class ClientQuotesLandingComponent implements OnInit {

  public title = 'Places';
  public addrKeys: string[];
  public addr: object;


  formattedAddress = '';
  truck_types = [];

  public form = {
    first_name : null,
    last_name : null,
    email : null,
    phone : null,
    address : null,
    business_name : null,
    truck_required : null,
    truck_type : null,
    quote_origin : null,
    quote_destination : null,
    commodity : null,
    loading_date : null,
    comment : null,
  };

  public error = {
    'first_name' : null,
    'last_name' : null,
    'email' : null,
    'phone' : null,
    'address' : null,
    'business_name' : null,
    'truck_required' : null,
    'truck_type' : null,
    'quote_origin' : null,
    'quote_destination' : null,
    'commodity' : null,
    'loading_date' : null,
    'comment' : null
  };


  constructor(
    private api: ApiService,
    private token: TokenService,
    private router: Router,
    private notify: SnotifyService,
    private zone: NgZone,
    ) {

     }

  ngOnInit() {
  }

  onSubmit(){
    this.notify.clear();
    var header = {
      'Content-Type': 'application/json'
    }
    return this.api.post('quote', this.form, header).subscribe(
      response => {
        this.router.navigateByUrl('/client-quote-landing-success')
        },
      error => this.errorHandle(error),
   );
  }

  tokenHandler(data){
    this.notify.clear();
    console.log(data);
  }

  errorHandle(error){
    this.notify.clear();
    console.log(error);
    this.error = error.error.errors;
  }

}

В тот момент, когда я нажимаю кнопку отправки, все данные сохраняются в базе данных. Однако я хочу отобразить все данные сразу после их сохранения.

Как изменить текущий код для достижения моей цели?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...