- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有这个简单的 ViewModel:
export class ViewModel {
public arr : KnockoutObservableArray<Dtos>;
constructor() {
this.arr = ko.observableArray<Dtos>(null);
ko.applyBindings(this);
this.init();
}
private init() {
var self = this;
ajaxCall().done(item => {
self.arr(item.Dtos);
});
}
public initPlugins() {
jQuery(".external-events > li")
.each(function() {
if ($(this).attr("event-draggable") == "false")
return true;
jQuery(this).draggable({
zIndex: 999,
revert: true, // will cause the event to go back to its
revertDuration: 0 // original position after the drag
});
});
}
}
此虚拟机正在应用此标记:
<ul class="external-events" data-bind="foreach: {arr, afterRender: initPlugins($data)}">
<li event-draggable="false">
<div class="bg-info">
<span data-bind="text: Name"></span>
</div>
<ul class="external-events" data-bind="foreach: moreStuff">
<li>
<div class="bg-info">
<span data-bind="text: Name"></span>
</div>
</li>
</ul>
</li>
</ul>
问题是 foreach
绑定(bind)的 afterRender
事件只被触发一次,显然是在 ko.applyBindings
之后,但 DOM 是尚未准备好,因此我们无法初始化 jQuery.ui
可拖动对象。
根据 Ko 文档,afterRender
应该在每次 observableArray
(属于相应的 foreach)发生变化时触发,但它没有发生。
最终,在填充数组后,我通过在 ajax.done
中初始化可拖动来使其工作,但我觉得这不是正确的方法,尽管如此,问题仍然存在, afterRender
不会在数组更新时触发。
任何想法将不胜感激。
PS:我所说的数组显然是指 ko.observableArray
最佳答案
问题出在你的
foreach: {arr, afterRender: initPlugins($data)}
afterRender
需要一个函数作为参数,但您通过使用数据作为参数来调用该函数,请将其更改为:
foreach: {arr, afterRender: initPlugins }
afterRender
方法将通过knockout调用,并带有2个参数:
插入的 DOM 元素的数组,它们所绑定(bind)的数据项
关于javascript - Knockout afterRender 仅触发一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42379894/
查看以下示例 HTML。这是一个简单的 KO foreach绑定(bind)和一个按钮以将新项目添加到 observableArray .添加工作正常,新项目出现。但是,afterRender方法永远
我有这个简单的 ViewModel: export class ViewModel { public arr : KnockoutObservableArray; construct
extjs 组件的beforeshow 和aferrender 事件有什么区别。 我还可以引用任何描述 extjs 事件触发顺序的文档(或描述在组件显示在屏幕上之前发生的步骤)? 最佳答案 befor
我有一个使用 3.2.0 的嵌套 KnockoutJS 组件的层次结构。它工作得很好,但我希望在我的整个组件层次结构加载和呈现后执行一些代码。它大致相当于 afterRender(),需要用于与 af
afterRender与模板绑定(bind)一起工作,但是在将我的模板转换为组件之后,似乎没有任何方法可以使用 afterRender .我尝试寻找使用 afterRender 的组件示例。 ,但找不
我有一个 afterRender 函数,它有一个事件监听器,当用户向下滚动页面时,它将固定类添加到元素中。将元素固定到页面会产生一个间隙,使所有后续元素看起来像是“跳跃”起来。我的想法是创建一个空的d
我正在使用一个简单的模板,其中包含一个 {{each}} block 。每次集合中发生变化时,整个模板都会重新呈现。 然后我在模板绑定(bind)中附加了一个 afterRender 事件。调用的函数
这是我目前使用的代码 App.directive('afterRender', ['$timeout', function ($timeout) { var def = { r
有没有办法在 Knockout 将 html 添加到 DOM 并完成渲染后运行自定义代码?我需要这个,所以我可以将嵌套 View 模型绑定(bind)到动态添加的 html 代码。 类似于: ...
我是 ember 框架的新手。我只想在渲染完成后执行一个在 Action 钩子(Hook)中定义的函数。 var Controller = Ember.Controller.extend({ ac
大家好,我有一个场景,我正在运行 foreach,并且使用模板。之后的 Render 总是调用包含该集合的 Object。我宁愿将其称为迭代元素,以便我可以在其上设置属性。 这可能吗? 最佳答案 af
我正在尝试使用 Knockout 的 afterRender 绑定(bind),但我引用的函数从未被调用。 我有嵌套的 View 模型:vmConcepts 和 vmConcept,其中 vmConc
您好,我尝试获取组件位置,但我发现 getXY() 会在不同的事件中显示不同的位置。 喜欢这个样本,fiddle init: function() { var me = this; m
在下面,您将找到两个使用模板渲染模式的示例。示例 A 无法正常工作。值 cmp.helloLiEl 在监听器函数中是 undefined。 afterrender 回调不知道 renderSelect
我已经从 fullpage.js github 页面阅读了有关 afterRender 的文档。在我的站点中,我在特定的 div 中包含由 AJAX 生成的内容。 下面的例子 $("#fullpage
为什么模板 div 在 afterRender 中显示为“:hidden”? 代码如下: $(document).ready(function() {
我正在处理图像列表。图像是动态加载的;引用列表存储在 observableArray 中。完全加载图像列表后,我想连接 DOM 元素的处理程序。我目前的实现: 在 View 中: //...con
我想在处理验证时显示加载符号。我的 .hbs 文件如下所示 我尝试将验证包装到 afterRender 运行循环中,但显然 afterRender 并不意味着 after-CSS。我的验证是在 di
afterLayout和layout,afterRender和render等事件有什么区别?我了解 beforeLayout 和 afterLayout 之间的区别——但布局事件有何不同? 最佳答案
当新数据添加到 View 中的表中时,我尝试调用一个函数,但它不起作用。我正在使用 Ember.js 2.5 我有两个模型,客户端和用户。一个客户端有多个用户。 我列出客户的 View 如下所示:
我是一名优秀的程序员,十分优秀!