ngSubmitは、私はこの非常に単純な形に構築

Question

livereloadまたはリダイレクトトリガー

onSubmit(): void { 
    console.log('NewEventPage#onSubmit - newEventForm has been submitted'); 

    let value = this.newEventForm.value; 
    let createdOn = moment.now(); 

    // Intermediate variables 
    let date = moment(value.date, 'YYYY-MM-DD'); 
    let timeStarts = moment(value.timeStarts, 'HH:mm'); 
    let timeEnds = moment(value.timeEnds, 'HH:mm'); 

    // Variables to store in DB 
    let timestampStarts = moment(date).add({hours: timeStarts.hour(), minutes: timeStarts.minute()}).unix(); 
    let timestampEnds = moment(date).add({hours: timeEnds.hour(), minutes: timeEnds.minute()}).unix(); 

    let joiners = {}; 
    joiners['aygdugyudg'] = true; 

    let event = { 
     title: value.title, 
     sport: value.sport, 
     location: value.form, 
     timestampStarts: timestampStarts, 
     timestampEnds: timestampEnds, 
     createdOn: createdOn, 
     owner: 'adazdazd', 
     joiners: joiners, 
     active: true 
    } 

    this.eventService.saveNewEvent(event) 
    .then(() => { console.log('NewEventPage#onSubmit - New event successfully saved') }) 
    .catch((error) => { console.log('NewEventPage#onSubmit - Could not save new event ', error) }); 

    } 

[送信]ボタンをクリックすると次のことを行います。

1. onSubmit関数のログが短時間表示されます（console.log（ 'NewEventPage＃onSubmit - newEventFormはs ubmitted '）））
2. 私は自分のホームページにリダイレクトして "？" （http://localhost:8100/？）

私は関数saveNewEventの呼び出しをコメントしようとしました。

saveNewEvent(event: any): Promise<any> { 
    console.log('EventService#saveNewEvent - Saving event ', event); 
    let shortEvent = { 
     title: event.title, 
     timestampStarts: event.timestampStarts, 
    } 
    let db = this.af.database; 
    let updates = {}; 
    let eventsNode = db.list(`/${this.dbService.company}/events`); 
    let userEventsPath = `/${this.dbService.company}/users/${this.dbService.uid}/events`; 

    return eventsNode.push(event) 
    .then((pushKey) => { 
     console.log('EventService#saveNewEvent - Event has been save to events node with id ', pushKey); 

     updates[`/${userEventsPath}/owned/${pushKey}`] = shortEvent; 
     updates[`/${userEventsPath}/joined/${pushKey}`] = shortEvent; 
     updates[`/queue/events/tasks/${pushKey}`] = { 
     id: pushKey, 
     company: this.dbService.company, 
     sport: event.sport 
     }; 
     db.object('/').update(updates); 

     console.log('EventService#saveNewEvent - Event propagated to following paths ', updates); 
    }) 
    .catch(error => { 
     console.log('EventService#createNewEvent - Error ', error); 
    }); 

    } 

どれ手がかり：私は上記の動作が発生しないことをやる（私はリダイレクトまたは再ロードされません）ので、私は推測すると、この機能とは何かを持っていますか？

Answer 1

htmlフォームのデフォルト動作を停止する必要があります。

$eventをonSubmit()のパラメータとして下の行のように追加してみてください。

<form [formGroup]="newEventForm" (ngSubmit)="onSubmit($event)">

あなたのJSコードに以下の変更に答えため

onSubmit(e): void { e.preventDefault();