问题标签 [javascript-databinding]

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 回答
1388 浏览

javascript - RivetsJS - 将输入动态绑定到列表项

我正在使用 RivetsJS 创建一个可通过输入框编辑的动态列表,并使用双向数据绑定来更新元素...

列表代码为:

和 RivetsJS 绑定:

现在我想创建一个可以实时编辑列表中的项目的元素..像

因此,当我更改输入数据时,列表中的元素 133 会更改..如果我更改输入上的 rv-editing-idx="133" 属性,则将编辑另一个元素..

关于如何实现这一目标的任何想法?

0 投票
2 回答
1411 浏览

html - HTML 选择表单变量默认值

我正在尝试为 HTML 选择表单设置默认值。我已阅读有关为选择表单设置常量默认值的帖子。但是,我希望默认值是变量shirt.Color,根据衬衫的不同,它可以是小、中或大。

例如,如果 shirt.Color 是 Small,我希望选择表单选择 Small;如果 shirt.Color 是 Medium,我希望选择表单选择 Medium;如果 shirt.Color 是大的,我希望选择表单选择大。

我知道如何使用数据绑定为文本框设置默认值。我使用以下设置默认衬衫颜色:

我可以为选择表单做一些类似简单的事情吗?我宁愿不为 Small、Medium 和 Large 手动编写每个案例。

我试过做

但是,这始终默认为第一个选项 Small。

0 投票
1 回答
296 浏览

javascript - Angular 双向数据绑定问候语

为可能是一个非常基本的问题道歉。我正在用 Angular 制作一个小演示测验项目。在第一页上,我有一个基本的双向数据绑定问候语(即您在一个框中输入您的姓名,它会欢迎用户,例如<p> Welcome {{name}} </p>

如何保存输入的名称并将此欢迎带到下一页/模板?这是代码

这是我的路线

我从一个 yeoman angular 脚手架开始,所以只更改了很少的代码。提前谢谢你善良的角度向导

0 投票
2 回答
2049 浏览

javascript - 双向数据绑定到 ngReact 组件

使用 ngReact,如何优雅地设置双向数据绑定?

假设我有一个简单的 React 输入组件,它需要 avalue和 fires onChange

然后从 AngularJS 方面,我希望value在范围内更新这样的内容:

但是,有没有更优雅的方法来设置到 AngularJS 范围的双向绑定,类似于ng-model

0 投票
2 回答
1902 浏览

javascript - 如何防止 Angular 在编辑时重新排序我的列表?

我使用 Angular 创建了一个小应用程序来管理 Todolists。每个列表都有许多待办事项。每个 todo 都有属性 name、value1 和 value2。

每个列表都应该由 Angular 自动排序,所以我使用了ng-repeat="todo in selectedList.todos | orderBy: todoOrderFilter"

在我的控制器中,我定义了我的订单过滤器,如下所示:

到目前为止,这很好用,直到我尝试使每一行都可编辑。为了实现这一点,我添加了一个额外<div>的输入元素来编辑每个元素中的值,<li>并且还添加了ng-hide="todo.editing"并且ng-show="todo.editing"能够通过简单地设置todo.editing=true或打开/关闭编辑模式false;

完整的 HTML 如下所示:

编辑按钮处理程序:

这有点工作,但是当我编辑 value1 或 value2 的输入字段时,我的排序功能会自动触发,这会导致<li>元素上下跳跃,这真的很糟糕。

所以我基本上想要的是我的自动排序过滤器在todo.editing=true.

到目前为止,我在 SO 上发现了这些类似的问题,但它们并没有真正的帮助:


问题:如何防止 Angular 使用待办事项列表 while todo.editing=true

0 投票
2 回答
418 浏览

javascript - 使用angularjs在html中加载异步解析数据

我正在尝试快速测试以调试为什么我的某些代码没有按预期工作。

我有一个名为的控制器testCtrl和一个服务myService。在服务中,我试图从 Parse 获取数据,一旦获得数据,我就会尝试将这些数据加载到我的前端 html 中。

这是代码:

这是我要显示数据的html代码:

results2不要在 html 中加载

这是控制台日志。

0 投票
1 回答
96 浏览

javascript - 编码字符打破 IE8 上的 Knockout js 数据绑定

我在 IE8 上遇到了一个非常奇怪的问题(并且仅在低于 8 的 IE 版本上)。问题出在 attr 绑定中,如果我输入编码的电子邮件字符串(使用 %26、%40 等),页面将不会在文本字段中呈现数据绑定(在以下情况下为“firstlast@domain.com”),相反,它将呈现为“mailto:first%26last%40domain.com”。

奇怪的是,如果我使用非编码字符串,它会呈现得很好

这两种方式都可以在 Firefox 和 Chrome 以及更高版本的 IE 上正常工作。

0 投票
1 回答
703 浏览

javascript - Node.js/Express 框架中将数据传递给 d3 以呈现图形数据的正确方法是什么

就目前而言,我有一个玉文件,我将数据从 js 文件传递​​到。然后我让玉文件需要一个处理 d3 代码的 js 文件。

我认为这不是正确的方法,但我不想从公共 js 文件中的 monogo 中提取数据,因为它对用户可见。

如果您对我的问题有点困惑,项目和结构在这里: https ://github.com/rdecuir/NodeJSGraphics

我正在尝试学习最佳实践和结构,但还没有找到任何有意义的结构化方式,我不想在玉文件中有脚本代码,也不想在我的 d3 中提取数据文件,因为它暴露给用户。

0 投票
1 回答
150 浏览

javascript - 多屏应用的两侧数据绑定javascript库使用

我是 ac# 开发人员,我正在编写信息亭应用程序。我们的信息亭有两个屏幕。客户一屏,操作员一屏。客户可以通过触摸屏输入个人信息。我想知道如何处理 html 页面中的多个屏幕。例如,我为客户和运营商创建了一个 html 页面。网页有两个文本输入,姓名和信用卡号码。当客户使用屏幕键盘写一个字母时,操作员应该同时看到每个字母的“x”。我的意思是两个不同的浏览器对象和一个 html 页面。我应该用淘汰赛,角度等来处理这个吗?我正在使用 C# WPF mvvm 模式处理这个问题。我将一个绑定对象用于两个不同的窗口对象,mvvm 模式为我处理两侧数据绑定。

0 投票
1 回答
43 浏览

javascript - 自定义绑定中的正确依赖跟踪

我想要实现的是在视觉上过滤由foreach绑定生成的表行,其中被过滤掉的行的tr元素将被隐藏而不是从 DOM 中删除。
当用户更改过滤条件时,这种方法显着提高了渲染性能。这就是为什么我不希望将foreach其绑定到根据过滤条件更新的计算可观察数组。
我希望这个解决方案成为一个现成的构建块,我可以在项目的其他地方使用它。

据我熟悉的淘汰赛,最好的方法是实现自定义绑定。

我打算使用这个绑定的方式是这样的:

根据当前行是否可见,itemsFilter返回的函数在哪里,如下所示:boolean

这是我到目前为止的绑定实现:

您是否看到init了谓词调用的丑陋部分而没有将对象传递给它?

如果没有这个,如果foreach在第一次 Knockout 调用该update方法时没有由绑定生成的行,则不会调用itemsFilterfilter 函数。
因此,不会读取任何可观察对象,并且 KO 依赖跟踪机制决定此绑定不依赖于我的视图模型中的任何可观察对象。
并且当过滤器可观察对象 (filterFromDatefilterDriver) 的值发生更改时,update将永远不会再次调用 并且整个过滤器不起作用。

我怎样才能改进这个实现(或解决问题的整个方法),以免对过滤器函数进行丑陋的调用,这至少使函数等待一个undefined值作为参数?