问题标签 [2-way-object-databinding]

我有以下html：

其中 post.text 是一个包装的trustedValue，如下所示：

我打开它后，它看起来像这样：

现在，我想创建一个指令，搜索该trustedValue，并将一个类添加到img 标签。到目前为止，我有这个：

我怎样才能从 html 中获取 post.text，双向绑定到它，并将该类添加到 post.text 中的所有图像？

I'm not getting how to over come the following situation, I have a directive with two scope passed from parent as "=" denoting the model binding say attr1 and attr2 are those values.

Inside directive I have used both in the interpolation {{attr1}} and {{attr2}}, Also I have used it inside input type text and email as models.

When I change the value of attr1 from textbox the value gets reflected in the interpolation {{attr1}}, but the change in attr2 textbox is not reflected in the interpolation {{attr2}} , although it gets binded when an valid email id is entered, but i need to show the email when its being typed.

Is there any work around for this ?

How can I do it ?

The fiddle is here.

Thanks,

Vinod Louis

I have two select option and am using ng-options to get the data from json files. My concern is if a value is selected in first select, i need to automatically choose a corresponding value in the other select. I am able to populate the data in the dropdowns. but am unable to connect the two. Please help.

Below is my code for first select:

And the second select is as follows:

And this is my code from controller:

在使用innerHTML 时，在Polymer 中创建与属性的数据绑定的最简单方法是什么？

这是我的意思的一个例子 - http://jsfiddle.net/ry6og1q9/2/

“staticFoo”纸张输入是与 {{foo}} 绑定的数据 - 一种双向数据绑定。

但是，使用 innerHTML 创建的“dynamicFoo”不会以任何方式绑定到 foo 属性，尽管它的标记存在。

我尝试使用 Node.bind() - http://www.polymer-project.org/docs/polymer/node_bind.html来完成此操作， 但它只绑定一种方式。

必须有一个平台实用程序可以进行解析/绑定，但我在任何地方都找不到它。

让我们再试试这个解释......

我是聚合物的新手（并且在相对较长的缺席后重新进入网络开发），我想知道推荐的方法可能是在采用 2 路数据绑定的同时更密切地管理对象状态。我目前正在使用 rest API (json) 对象。我的问题是聚合物是否在启动对绑定对象的属性/属性的更新之前保留原始对象的副本......所以人们可能能够轻松撤消更改？虽然通常需要允许 2 路数据绑定发挥其魔力，但在某些情况下，我想阻止/延迟对对象/DOM 的更改，直到用户批准更改（例如通过纸质对话框组件）。我想可以制作对象的临时副本并将字段绑定到该版本，然后仅在用户批准后将更改保留回源对象。无论如何，我很想听听想法并查看一两个推荐方法的示例（特别是如果我的想法偏离轨道！）

好的，这是泡菜：

我使用 ng-repeat 遍历菜单项：

当我尝试从购物车 'theCart[$index].product.qty' 中的项目中获取值时会出现问题，因为 $index 未绑定到任何特定项目，只是数组中的位置。我需要获取数组深处的唯一标识符 2 个对象，因此我可以确保通过 Angular 提供的双向数据绑定获得正确的值。

提前感谢您的任何见解。

在 Angular 中，我有这个简单的模型：

我使用 ng-repeat 在 html 中呈现它：

基本上，我想将我最后一个 div 中显示的值（写入值编译的地方）绑定为同一行中的输入范围值与同一行最后一列中的值的乘积。如果可能的话，我想了解是否有一种方法可以引用位于 x 列和 y 行中的任何值并能够与之交互，将其放入公式等......而无需构建另一个角度模型。

让我知道我想要达到的目标是否足够清楚。

编辑：我的数据有点像这样：

我可能需要重组数据的格式。这个想法是按行显示销售、毛利润等概念，而值显示在按年份分组的列中

所以中间阶段就像：

这个想法是我想添加两列，

• 每行都有一个滑块（输入范围），显示增长率，所以基本上输入范围从 -0.05 到 +0.05
• 另一列显示 2014 年的预测：所以 2014 年销售额 = 2013 年销售额 *（1+ 滑块值），2014 年毛利润 = 2013 年毛利润 *（1+ 滑块值）

所以我们有 2 个额外的列，第一列包含每行的滑块，第二列显示 2013 列的结果乘以滑块值。希望现在更清楚了。

我正在使用带有 winforms 文本框的 2 方式绑定。我需要确定用户是否更改了我的数据查看帮助

CurrentItemChanged 事件

如果属性已更改，似乎此事件会触发，但是如果当前已更改，它也会触发。

有没有办法判断数据是否发生了变化？

这里也问了一个类似的问题， 但我认为没有回答

Oliver 提到“如果您在 List 中的对象支持 INotifyPropertyChanged 事件，并且您将 List 替换为 BindingList，您可以订阅 BindingList 的 ListChanged 事件以了解用户所做的任何更改。”

我的应用程序符合这些条件，但我无法正常工作。ListChangedType.ItemChanged 属性看起来很有希望，但是当我导航到下一条记录而不更改数据时它会发生变化

我在这里找到了 Microsoft的链接，但肯定不会那么难！

RivetJS太棒了！感谢您使它成为不可知论者！

这是我需要的一个关键特性，我正在努力使用 RivetJS 来完成它。

到目前为止，我能做的最多的是获取稍后将使用以下内容克隆的元素：

而不是console.info那里，我可以操纵活页夹，但我认为这并不能真正帮助我完成这项工作。或者我可能遗漏了什么？

在 [each-*] 创建和销毁视图时获得回调的计划是什么？

对我来说，回调是理想的，这样我就可以让控制器干净地维护它的子视图和子控制器。这需要 Rivets.js 中的功能请求吗？

我想要一个像这样的集合：

和一个内容可编辑的 div，它会将所有内容都放在上面，但绑定到数组，这样当我更改 innerText 或表示对象的输入时，数组将相应地更新。

例如，没有 angularJS 的 div 看起来像这样：

这应该与 div 中的退格键以及要插入的新输入或要键入的文本一起使用，从而相应地更新数组。

我知道可能我必须使用 Mutation Observers，但我不知道如何在这个复杂的示例中使用。我希望 AngularJs 能够与突变观察者进行更自动化的集成：/

我的原始方法是：我为整个集合制作了一个指令，为 innerText 制作了一个指令，为对象制作了一个指令。输入与对象名称的绑定当然有效，但在 contenteditable 的内部 DOM 发生突变时无效。同样将 {{innerText}} 作为 innerText 的模板并在 contenteditable 中使用它并不能保证有人会实际输入它，因此绑定将起作用（而不是在它之前或之后）

编辑：如果它使具有相同内容的集合变得更容易，那么可编辑仍然非常有用

Edit2：重新打开问题。以前接受的答案方法非常好，但今天我意识到它不是真正的双向绑定。它实际上是单向绑定。从视图到模型。如果使用提供的代码的更新版本（来自先前接受的答案）来获得类似的模型，则将奖励赏金

这将使视图：

该解决方案必须为服务提供代码，该服务将在按下新按钮时返回一个像上面那样的静态模型，并且控制器中的一个函数将把 modelValue 放在作用域中，并且模型将转换为上面的 viewValue .

Edit3：根据下面的更新答案，这里是真正的 2-way binding 如何在没有建议的 $watch 的情况下使用 compile pre-link 和 post-link 工作：