атрибут "action" не работает в шаблоне "Angular" - PullRequest
0 голосов
/ 23 сентября 2018

Требование:

Мне нужно опубликовать данные формы , используя атрибут action из формы контакта в Angular.

Проблема:

Решение будет работать, если мы создадим статический файл с этой формой.но атрибут action не работает при использовании внутри шаблона angular.Кажется, при нажатии кнопки НЕ выполняется никаких действий.

Моя форма:

<form 
    id="gform" 
    action="https://script.google.com/sampleUrl" 
    method="POST" 
    [formGroup]="form" 
    fxLayout="column" 
    fxLayoutAlign="space-evenly stretch">
    <mat-form-field>
        <input type="text" matInput placeholder="Name" formControlName="name" name="Name" required>
        <mat-error *ngIf="form.get('name').invalid">Please enter a Name</mat-error>
    </mat-form-field>
    <mat-form-field>
        <input matInput placeholder="e-mail" formControlName="email" name="Email" required>
        <mat-error *ngIf="form.get('email').invalid">Please enter a valid e-mail</mat-error>
    </mat-form-field>
    <mat-form-field>
        <input matInput placeholder="Number" formControlName="number" name="Phone" required>
        <mat-error *ngIf="form.get('number').invalid">Please enter phone number</mat-error>
    </mat-form-field>
    <button type="submit" mat-raised-button color="primary" >Submit</button> -->
</form>

Информация о версии:

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 6.2.2
Node: 10.5.0
OS: win32 x64
Angular: 6.1.7
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.8
@angular-devkit/build-angular     0.6.8
@angular-devkit/build-optimizer   0.6.8
@angular-devkit/core              0.6.8
@angular-devkit/schematics        0.8.2
@angular/cdk                      6.4.7
@angular/cli                      6.2.2
@angular/flex-layout              6.0.0-beta.18
@angular/material                 6.4.7
@ngtools/webpack                  6.0.8
@schematics/angular               0.8.2
@schematics/update                0.8.2
rxjs                              6.3.2
typescript                        2.9.2
webpack                           4.8.3

Примечание: Я пытаюсь использовать API таблиц Google, чтобы записать в документ Google.Возникает проблема с CORS при использовании вызова метода,

1 Ответ

0 голосов
/ 23 сентября 2018

Обычно, если вы хотите получить данные, которые вы используете (отправить)

<form [formGroup]="form" (submit)="submit(form)">...</form>

Если ваш .ts

submit(form)
{
   if (form.valid)
     this.httpClient.post("https://script.google.com/sampleUrl",form.value)
         .subscribe(res=>console.log(res))
}

Если вы хотите перенаправить на новую страницу, используйте простойформу, но не забудьте написать ngNoForm , https://angular.io/api/forms/NgForm else Угловое преобразование вашей формы в угловую форму

...