dom 完成加载 durandal 后调用函数答案

【问题标题】：Calling a function once the dom has finished loading durandaldom 完成加载 durandal 后调用函数
【发布时间】：2016-04-26 07:18:44
【问题描述】：

我有一个在 onchange 事件中调用的函数。我从该函数中获取值并在我视图中的其他位置显示该值。这是我的代码

ViewModel 代码

       DisplayDetails = function(data, event)
     {
    var id = event.target.id;
     var input = document.getElementById(id).value;
    alert(input);

    var div = document.getElementById('childcontainer');

        if(div == null)
        {
          return;
        }
        else
        {
          div.innerHTML = input.value;

        }


}

查看代码

<input  class="form-control" name="FName" type="text" id="FName" placeholder="First Name"  data-bind=" value: FName , event: { keyup: blockSpecialCharAndNumeric }, event: { change: DisplayDetails }"  >

我的函数被调用并且我得到了值，但是在显示时我得到了 div = null 因为我的函数在 dom 完成加载之前被调用。我知道在 durandal 我们有 composition.addBindingHandler 。我浏览了文档，但不确定如何在我的场景中使用它。谢谢你的建议

【问题讨论】：

标签： javascript html dom durandal

【解决方案1】：

Durandal 功能 lifecycle callbacks，在视图模型生命周期的各个点被调用，包括视图被组合到 DOM 中的点。

尝试实现 compositionComplete 并从那里访问您的“子容器”元素。此时，您的元素将成为 DOM 的一部分。您可能想要修改您的事件处理程序，使其仅在 compositionComplete 之后执行。

【讨论】：