问题标签 [angular-template-form]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
90 浏览

angular - 从 http 请求数据创建表单

我是 Angular 的新手,所以还在学习它,它可能是简单的用例,但到目前为止我一直在尝试实现它但无法做到,所以在这里问。我正在发出一个 http 请求,并根据从 http 请求(json 对象数组)收到的数据,我想在页面上创建与响应数组中的对象一样多的表单。知道如何实现它。这是我从 http 请求中获得的数据在此处输入图像描述

进行了很多搜索,但没有找到任何关于我给定问题的 stackoverflow 答案,从 4 天开始一​​直在努力实现它:(请不要关闭它,我无法弄清楚,所以在这里问它。任何提示从哪里开始以及如何进行非常感谢。

0 投票
1 回答
798 浏览

angular - 模板引用变量:分配 ngForm 和 ngModel

我正在 Pluralsight 上学习 Angular,我有一个关于我目前正在学习的课程的问题。

当模板引用变量被赋值时,我对它们背后的推理感到困惑。例如,如果您放入#name一个<input>标签,我知道 name 现在可以引用输入标签及其关联值。我的问题是关于诸如#name="ngModel"

查看 Angular 文档,我发现:

您需要一个模板引用变量来从模板中访问输入框的 Angular 控件。在这里,您创建了一个名为 name 的变量,并为其赋予了值“ngModel”。

我还发现这个有用的答案可以指导我走上正确的道路。

但是我仍然不清楚分配模板引用变量ngModel会增加什么值。

我目前正在写的表格的一部分:

打字稿文件的一部分:

#nameField仅 using与 using#nameField="ngModel"以及#formvs有什么区别#form="ngForm"

0 投票
1 回答
688 浏览

angular - 使用 Mat-Select 实现默认值的 Angular Material Stepper

我希望在 Angular 材料的步进器中使用 mat-select 显示默认值。

[编辑] 您不能将 formControlName 与双向绑定一起使用。我最终在声明表单组时初始化了组件中的值

TS 文件

0 投票
0 回答
181 浏览

angular - 我想在我的 ionic 应用程序中创建一个模板驱动的表单,并通过验证它给出错误

每当我ngModel与 id 一起使用时,它都会出错。如果我不使用它,那么它会显示一个错误,即 invalid is not any property。请告诉我哪里出错了。

0 投票
0 回答
144 浏览

angular - Angular 模板驱动的表单自定义验证

我需要为 Angular 模板驱动的表单编写自定义验证器,其中任何一个非空输入都足以使表单有效。

考虑以下带有两个输入字段和提交按钮的 Angular 表单:

要求 - 如果两个输入中的任何一个不应该为空,则使表单有效(除了输入模式验证)。为输入控件编写自定义验证器是没有意义的——它只会受到其自身值范围的限制。订阅表单事件statusChanges还需要注意 - 此信息是只读的。何时编写控件自定义验证器(如输入控件)并将其应用于表单然后它将不起作用 - 它似乎不会被表单调用。

为 Angular 模板驱动的表单编写自定义验证器的正确方法是什么?

0 投票
1 回答
647 浏览

angular - 如何根据下拉值在 Angular 表单中添加/删除或显示/隐藏文本框

r

在从这个打开的下拉列表中选择一个特定的项目时,我希望文本框以表格形式显示这些下拉列表值中的每一个都有某些从数据库中获取的属性。

这是表格

我在选择下拉项时调用的方法

我想在对话框打开时隐藏文本框。并且仅在maintainanceSchedule 为true 时显示维护文本框,当calibrationSchedule 为true 时显示校准文本框,或者在getGroupDetail() 函数中两者都为true 时显示校准文本框。

0 投票
1 回答
412 浏览

typescript - 带有可选字段的 Angular NgForm.setValue({})

我有一个角度的模板驱动形式,当我单击产品时,我想在其上填充值。'description' 和 'imageUrl' 字段可能是未定义的,如果我不照顾它会破坏我的表单。我设法用这个解决方案做到了:

有没有更简单或更清洁的方法来做到这一点?谢谢 !

0 投票
1 回答
619 浏览

angular - 带有模板驱动表单的 ngx-bootstrap 模板模式,提交问题

我有模板参考模式,里面有模板驱动的表单。当我提交表单时,所有表单值都会打印在 url

下面是我的按钮打开模式的 html 代码:

下面是我的模态html代码:

以下是我的 ts 代码:

提交页面刷新后,我没有按预期在控制台日志上得到任何内容,并且所有表单值都打印在 url 上。

0 投票
1 回答
335 浏览

angular - 如何在 angular9 中手动将 Angular 模板驱动的表单设置为无效

我想从 .ts 文件中手动将EmployeeForm设置为无效。这里EmployeeForm是一个模板驱动的表单。

我曾尝试执行以下操作,但没有成功。

错误信息说:

“NgForm”类型上不存在属性“setErrors”。您的意思是 'getError'吗?

当我将它与其他响应式表单一起使用时,相同的代码可以工作

0 投票
0 回答
277 浏览

angular - 模板和反应形式的角度自定义组件

我正在尝试创建一个自定义组件(一个自定义的自动完成字段),但我想为反应式表单和模板表单工作所以有时价值会通过[(ngModel)],有时我想提供formControlName

到现在为止,我有 2 个不同的模板,但无论我在哪里看,似乎 NG_VALUE_ACCESSOR 都在自己处理它,我的实现中只是缺少一些东西。

为了让我的问题更清楚如果您使用 PrimeNg 组件或任何框架,同一个组件可以采用 [(ngModel)] 或 formControlName 并且它在两种情况下都表现为正常组件而无需特殊处理,这就是我想要做的

具有相同问题的类似问题:

如何使用反应形式包装像自动完成这样的primeng组件?