Angular 2应用程序中的随机重定向
我遇到了一个奇怪的情况,everynow和angular应用程序似乎都会进行一些随机重定向 我有一个注释部分,当您添加一个新注释时,它应该将注释添加到注释列表中(代码中没有重定向)。但由于某些原因,当用户第一次登录并创建第一个便笺时(这只发生在第一个便笺上,所有连续的便笺都按预期工作) 重定向还将一些有趣的参数添加到URLAngular 2应用程序中的随机重定向,angular,redirect,angular2-routing,Angular,Redirect,Angular2 Routing,我遇到了一个奇怪的情况,everynow和angular应用程序似乎都会进行一些随机重定向 我有一个注释部分,当您添加一个新注释时,它应该将注释添加到注释列表中(代码中没有重定向)。但由于某些原因,当用户第一次登录并创建第一个便笺时(这只发生在第一个便笺上,所有连续的便笺都按预期工作) 重定向还将一些有趣的参数添加到URLhttp://localhost:4200/phils-测试团队/目标?正文=将%2重定向到%2目标&标题=&标题= 此?body=将%2b重定向到%2Bgoals&title
http://localhost:4200/phils-测试团队/目标?正文=将%2重定向到%2目标&标题=&标题=
此?body=将%2b重定向到%2Bgoals&title=&title=
不在代码中
当我检查控制台并启用路由跟踪时,所有看起来都是正确的
我想问题是,在angular中是否有一些特定的东西会影响重定向,或者可能导致重定向,而不在代码中指定它们
新注释.组件
@Component({
selector: 'new-note',
templateUrl: './new-note.component.html',
styleUrls: ['./new-note.component.styl']
})
export class NewNoteComponent implements OnInit, OnChanges {
@Input() initialValue:any;
experiment_id: string;
goal_id: string;
user_id: string;
team_id: string;
form: FormGroup;
date_created: any;
isActive = false;
constructor(
private fb: FormBuilder,
private route: ActivatedRoute,
private notesService: NotesService,
private usersService: UsersService
) {}
ngOnInit() {
this.isActive = false;
this.date_created = new Date();
this.route.parent.data.map((d: any) => d.experiment).subscribe((experiment: any) => {
this.user_id = experiment.user_id;
this.team_id = experiment.team_id;
this.goal_id = experiment.goal_id;
this.experiment_id = experiment.$key;
});
this.form = this.fb.group({
body: ['',Validators.required],
date_modified: new Date(),
customer: [''],
company: ['']
// rating: ['',Validators.required]
});
console.log(this.form);
}
ngOnChanges(changes:SimpleChanges) {
if (changes['initialValue']) {
this.form.patchValue(changes['initialValue'].currentValue);
this.experiment_id = this.team_id;
}
}
isErrorVisible(field:string, error:string) {
return this.form.controls[field].dirty
&& this.form.controls[field].errors &&
this.form.controls[field].errors[error];
}
reset() {
this.form.reset();
}
get valid() {
return this.form.valid;
}
get value() {
return this.form.value;
}
// Toggle Add Note
onToggleAddNote() {
this.isActive = !this.isActive;
event.preventDefault();
}
save(form, onToggleAddNoteInActive) {
this.notesService.createNewNote(this.team_id, this.user_id, this.goal_id, this.experiment_id, form.value, this.date_created)
.subscribe(
() => {
// alert("note created succesfully. Create another note ?");
form.reset();
this.isActive = false;
},
err => alert(`error creating note ${err}`)
);
}
}
应用程序。路线
export const routerConfig: Route[] = [
{
path: 'teams/new',
component: NewTeamComponent
},
{
path: 'home', redirectTo: '/login'
},
{
path: ':team-name',
canActivate: [AuthGuard],
component: AppComponent,
resolve: {
team: TeamResolver
},
children: [
{
path: 'goals',
children: [
{ path: ':goal_id', component: SingleGoalComponent,
resolve: {
goal: GoalResolver
},
children: [
{ path: 'experiments/new', component: NewExperimentComponent },
{ path: 'experiments/:experiment_id',
resolve: {
experiment: ExperimentResolver
},
children: [
{ path: 'edit', component: EditExperimentComponent,
},
{ path: '', component: ExperimentDetailsComponent,
children: [
{ path: 'notes', component: ExperimentNotesComponent },
{ path: '', component: BlankNotesComponent }
]
}
]
},
{ path: '', component: ExperimentsComponent }
]
},
{ path: '', component: GoalsComponent }
]
},
{ path: 'notes', component: NotesComponent }
]
},
{ path: '', redirectTo: '/login', pathMatch: 'full' },
{ path: '**', redirectTo: 'home' }
];
更新:
我注意到它实际上是将表单的内容添加到URL中
http://localhost:4800/phils-test-team/goals?body=new%2Bgoal%2Bshould%2Bbe%2Badded%2Bwith%2Bout%2Bany%2Bproblems&title=&title=
更新:
new-note.component.html
<div class="add-note" [class.is-active]="isActive">
<button class="add-note-button" (click)="onToggleAddNote()">
Add Note
<md-icon svgSrc="assets/images/plus-circle-outline.svg"></md-icon>
</button>
<div class="add-note-content">
<form [formGroup]="form" autocomplete="off" novalidate class="note-form">
<fieldset>
<div class="form-field">
<textarea name="body" formControlName="body"></textarea>
<div class="field-error-message"
*ngIf="isErrorVisible('body', 'required')">
field is mandatory
</div>
</div>
<div class="btn-toolbar">
<div class="btn-group actions">
<button class="btn btn-outline-primary" (click)="onToggleAddNote()">
Cancel
</button>
<button class="btn btn-outline-success" [disabled]="!form.valid" (click)="save(form)">
Save
</button>
</div>
</div>
</fieldset>
</form>
</div>
</div>
添加注释
字段是必需的
取消
拯救
表单HTML是什么样子的?您是否导入FormsModule
和/或ReactiveFormsModule
?我正在使用ReactiveFormsModule
将表单添加到上述代码中(如果有帮助)。