问题标签 [angular-ngmodel]

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 投票
2 回答
3731 浏览

javascript - 当 ngmodel 与嵌套对象一起使用时,为什么 AngularJS 无法初始化选择选项(下拉列表)?

我有一个复杂的对象,其中包含一些嵌套的对象数组。在其中一个内部对象内部是一个值,它是另一个列表中项目的 id。该列表只是代码和描述的查找,如下所示:

但是,我只携带嵌套对象中的值。选择选项列表(下拉列表)将显示上一个列表中的所有值,以便用户进行选择。

通过 ng-model 绑定

然后,我将从 Select/Option 返回的值直接绑定到嵌套对象。这样,当用户进行选择时,我的对象应该被更新,这样我就可以将整个对象保存(发布)回服务器。

初始化是问题

选择工作正常,我可以看到当用户选择时,值都在我的嵌套对象中正确更新。但是,当我从服务器检索(嵌套)对象时,我无法将 UI(选择/选项)初始化为正确的值。

输入类型文本绑定正确 我的下一步是向表单添加一个文本框,将其绑定到相同的 ng-model 并查看它是否已初始化。它做了。

这是我正在进行的一个大型项目,因此我创建了一个 plnkr.co 并解决了问题。您可以在以下位置查看我的 plnkr:http ://plnkr.co/edit/vyySAmr6OhCbzNnXiq4a?p=preview

我的 plunker 看起来像这样:

小样

未初始化

我已经从示例 1 中的项目中重新创建了确切的对象,正如您所见,由于 value(id) 实际上是 3,因此在初始化时未正确选择下拉列表,但下拉列表未显示选定的值。

请记住:它们是绑定的,选择一个会更新值

如果您尝试使用 plunker,您将看到这些值已绑定到选择/选项列表,因为即使在未正确初始化的示例中,当您选择一个项目时,其他绑定的项目也会立即更新。

得到它的工作:哈克!

我使用它很长时间,并不断创建假对象,以查看哪些有效,哪些无效。仅当我将值对象更改为如下所示的对象时,它才有效:

现在,我可以将 xy ( ng-model="x.y") 绑定到选择/选项,它会按照您的预期初始化选择/选项列表。请参阅 plunker 中的示例 2,您将看到按预期选择了“混合”(id 值 3)。

附加作品

我还了解到以下内容将起作用:

更多嵌套

在这种情况下,我可以将 lastObj.inner 绑定到选择/选项列表,您可以再次在示例 3 中看到它仍然有效。那是一个对象,其中包含一个包含值的数组。

失败的最小嵌套

但是,plunker 中的示例 4 显示了嵌套的最终数量,这不适用于 AngularJS 绑定。

这是一个对象,其中包含一个数组,该数组包含一个具有值的对象。它无法正确绑定选择/选项,但不能正确绑定文本框。

谁能解释一下,或者它是一个错误,或两者兼而有之?

谁能解释为什么在这种情况下选择/选项无法正确绑定/初始化?

最后一点

另外,要坚强,不要试图解释为什么你认为我的对象的嵌套应该不同。这不在此处讨论,除非您可以告诉我 JavaScript 本身不支持该行为。

但是,如果您可以解释 Angular 无法处理这么深的嵌套以及原因,那么这是一个完全有效的答案。

感谢您的任何意见。

0 投票
1 回答
206 浏览

angularjs - Angularjs 将 ng-model 动态绑定到一个值

我想动态更改 ng-model 值的引用。我可以这样做,例如:

这可行,但我的问题是,仅当“normalStringValue1 或 2 是数组”时,参考更改才有效!如果正常的字符串值如下所示:

我只想保存一个字符串,比如normalStringValue1 : 'Hello'引用不会正确更改,为什么会这样?我该如何解决这个问题?

0 投票
2 回答
386 浏览

angularjs - 是否可以使用角度过滤请求的结果设置范围变量?

我的这段代码运行良好(参见代码片段如下)。

是否可以在结果(数组)的范围内设置新的模型变量,任何时候作为用户选择的结果执行新请求?

0 投票
1 回答
2088 浏览

angularjs - 使用 Angular 动态添加输入字段并对模糊执行验证

开始时的表格有 1 个地址输入字段。波纹管有一个链接,单击该链接会添加另一个输入,依此类推。字段数量没有限制。

  1. 有没有更优雅的方式在 Angular 的模型集合中添加新元素?我目前正在使用一个空元素数组,在链接上单击我只是在该数组中推送另一个空元素,以便 ng-repeat 将其拾取。当我想提交表单时,我会遍历该数组并过滤掉不为空的元素。

  2. 当输入字段被聚焦/模糊时,应该执行验证。我目前正在 ng-blur 事件上从控制器调用一个函数,但我无法将当前输入文本值传递给它。

小提琴

HTML:

JS:

0 投票
1 回答
5609 浏览

angularjs - 通过 Javascript 设置 Angularjs ng-model 值

我在这个网站上查看了许多答案/问题,但似乎没有一个能解决我的问题。如果我错了,我道歉。

这是我的示例的链接,因此您可以查看我的代码及其行为:示例代码

考虑两个对象:

我将它们显示如下:

请注意,“行”包含重复值,并且项目是一组(唯一项目)。

在我正在创建的应用程序中,当用户单击其中一行时,我需要提供一个输入字段来更新行键指向的项目。而且,我需要双向绑定,以便通过输入的更改自动反映在整个行中。

在我的示例中(参见上面的链接),我添加了两个输入标签:

输入 #1 使用对项目的显式引用设置 ng-model。输入 #2 使用 $scope 中存在的变量设置 ng-model 的值。

当用户通过 ng-repeat 单击 div(行)输出时,mymodel 的值会发生变化。

输入 1 按预期工作。通过输入所做的更改会自动反映在生成的 div 中。

输入 2 代表我要完成的工作:将输入元素中的 ng-model 动态绑定到用户单击的 div 行中的同一模型。在我提供的示例中,正确的文本显示在输入中,但它与具有相同键的 div 行之间没有双向绑定。

这是我的完整脚本:

这是我的 index.html:

提前感谢您的帮助!

0 投票
1 回答
78 浏览

angularjs - AngularJS - 从另一个指令访问模型

这是一个 plnkr

如何headerInputsideMenuContent指令中访问模型?假设我有 10 个其他ng-modelsinsideMenuHeader指令要访问sideMenuContent,有什么方法可以使其易于扩展吗?

0 投票
2 回答
14692 浏览

javascript - How to use an object as ng-value of a radio button?

Is there any way to use an object for ng-value of a radio button?

Imagine you have a radio button whose ng-model is an object, like this:

And this would be the radio button:

Is there a way to do something like the following (obviously it doesn't work)

? Thanks

I know I can use the ng-change directive. I'm just wondering if what I am asking it's possible, it would be very smart

EDIT: as requested in the comments, I am giving a bit of extra info on my setup.

I want to save in the model both the value of the button and its label. So let's say I have an array in my controller called impactOptions and a ng-repeat directive to create the buttons:

The problem with this setup is that in that way I'm only saving the value of the button, while I would like to also save it's label. I really need it later.

I'm looking for a way to do something like this

0 投票
1 回答
2388 浏览

angularjs - ng-model 和 ng-repeat 的问题,输入值在页面上的每个表单字段上重复

我有一个基于 ng-repeat 创建多个表单的页面。一切正常,直到将某些内容写入输入并且所有其他重复表单输入元素上的所有内容都被复制。我使用了 ng-model="Notify.message" ,它只是一个对象,它从输入中获取值并发送到按钮提交的控制以及其余的逻辑。

我正在寻找如果一个表格被填写,其他表格应该保持不变并且不应该重复表格1的输入文本中写入的值。

这是代码:

0 投票
2 回答
2187 浏览

angularjs - ng-model 和 ng-repeat 的问题,重复表单

我有一个页面,其中基于ng-repeat. 一切正常,直到将某些内容写入输入并且所有其他重复表单输入元素上的所有内容都被复制。我使用ng-model="Notify.message"的只是对象,它从输入中获取值并发送到按钮提交的控制,因此其余的逻辑。

我正在寻找如果一个表格被填写,其他表格应该保持不变并且不应该重复表格1的输入文本中写入的值。

这是代码:

问题小提琴 - jsfiddle

在这里,您可以在一个输入中写入某些内容时,其他内容也会被填充:(。此外,Notify 是一个 Java 映射对象,而 message 是其中的一个变量。请让我知道如何将其隔离!

0 投票
2 回答
602 浏览

javascript - Ng-Repeat 中的 Ng-Model(不是与原始类型问题的绑定)

** 编辑:抱歉,我的第一个示例不代表我拥有的代码。

经过数小时的研究和测试,我终于诉诸于此。

问题是:我无法从我的 ng-repeat 的子范围内更新我的控制器范围内的模型。我没有迭代原语,因为这似乎是这个问题的常见原因,此外,在尝试在 repl 中复制我的问题时,我正在做的事情似乎有效......任何帮助将不胜感激。

我目前正在使用 Angular 1.2.16

第一: plunker中的一个工作示例

二:破码

HTML // 这个片段被包装在一个 ng-app 中,只是不包括在内

我也尝试过直接从 ng-repeat 内部引用父范围(尽管我认为我不应该提供我的数据),但无济于事。

我很困扰。从我所有的研究来看,这应该完全没问题。并且作为链接,在实践中有效。

我只发布一个单独的问题,因为我遇到了奇怪的问题,并且因为以前的建议,主要是关于范围如何工作和绑定到原语,似乎不是问题所在。

非常感谢您的帮助。