forms 相关问题

我有一个 Angular2 表单（例如）我有一个 Angular2 表单（例如） <form id="myLovelyForm" name="myLovelyForm" #myLovelyForm="ngForm"> <label [attr.for]="myLovelyCheckbox"> <input [attr.id]="myLovelyCheckbox" type="checkbox" [(ngModel)]="myLovelyCheckbox"> <span class="myLovelyCheckbox">myLovelyCheckbox</span> </label> </form> 还有一个动画，如果表单脏了，应该启动： <div id="myLovelyNotification" class="myLovelyNotification" [@notification]="myLovelyForm.form.dirty"> ..... ..... </div> 如果我设置 [@notification] = true，动画可以正常工作，但如果我触摸表单并更改元素，我的 myLovelyForm.dirty 不会触发。如果 @notification 为 false，则动画停止，即，如果之前选中了复选框，并且我错误地取消选择它并再次选择它，则表单不是原始（触摸）但不再是脏的，因此动画应该停止。如果我手动设置@notification = false，它就可以正常工作。最大的问题是：如何以正确的方式检测/观察 angular2 形式的“脏状态”？简单- @ViewChild('f') templateForm: any; ngOnInit() { this.templateForm.valueChanges.subscribe((value: any) => { if (this.templateForm.dirty) { console.log('template form dirty - yes: ', value); } else { console.log('template form dirty - no: '); } }); } 您的模板包含： <form #f="ngForm" (ngSubmit)="save(f)> ... </form> 然而，这仍然使用模板表单，它们确实可以帮助弥合与 Angular1 应用程序的差距。模型驱动表单是 Angular 2 的方法，除了真正的基本应用程序之外，其他任何东西都可以使用模型驱动表单。参见示例： https://blog.thoughtram.io/angular/2016/06/22/model-driven-forms-in-angular-2.html http://blog.ng-book.com/the-ultimate-guide-to-forms-in-angular-2/ 并使用自定义组件来真正扩展和超越您的应用程序 - https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html 您可以订阅表单更改： this.physicalForm.valueChanges .map((value) => { return value; }) .subscribe((value) => { if(this.selectedPhysical.weight != this.physicalForm.value.weight) { this.selectedPhysical.weight = this.physicalForm.value.weight; } this.isDirty == this.physicalForm.touched; }); 如果此事件触发，那么您就知道您的表单已脏。这是我实际应用程序的示例（nut.abbr 是 formcontrolName）： ngOnInit() { for (let nut of this.userSettings.nutrientData) { this.foodSettingsForm.controls[nut.abbr].valueChanges .subscribe(v => { console.log("value: ", v); this.completeValueChange(nut.abbr, v); }); } } completeValueChange(field: string, value: boolean) { this.isChanged = true; Nutrient.updateNutrient(field, value, this.userSettings.nutrientData); } 现在，Angular 18 FormControl 具有 events Observable，您可以在其中监听 PristineChangeEvent 等事件 this.form.events.pipe(takeUntilDestroyed()).subscribe((event) => { if (event instanceof PristineChangeEvent) { console.log('form pristine change ', event.pristine); console.log(this.form.pristine); // same same } });

forms angular

回答 3 投票 0

如何使用Python Flask使用从HTML网页上传的图像

我正在尝试创建一个图像识别程序，到目前为止我已经制作了模型和所有实际的人工智能方面的东西。然而，当将其实现到网站中时，我一直......

python html forms flask upload

回答 1 投票 0

如何在空 div 内提交作为 XMLHttpRequest 结果的表单，而不刷新页面？

我正在尝试制作一个类似聊天室的网站。但我遇到了一个与 AJAX 相关的大问题。我在主页中有一个空的 div，在其中加载在数据库中找到的所有消息...

javascript php ajax database forms

回答 1 投票 0

使用 setCustomValidity 停止验证输入

当我的输入不符合所需的正则表达式模式时，我想设置自定义验证消息。我知道我们可以使用输入中内置的 setCustomValidity() 函数来执行此操作，但是...