javascript - 如何在初始化后更新 View ，但不使用 didInsertElement() ？

Question

我在函数 didInsertElement 中初始化了一个 jQuery 插件 slider 。

不幸的是，我还在页面上更新了一个计算属性，当更新计算属性时， slider 会重新初始化，因为 didInsertElement 函数会再次触发。

是否有一个函数会在 html 元素打印到 View 中之后触发一次，以便我可以初始化我的 slider ，但不是每次页面更改或元素被删除或删除了？

<小时/>

编辑:

我尝试过:

didInsertElement: function () {
    Ember.run.once(this, 'initSliders');
}

但不幸的是，每次更新计算属性时它仍然会运行。

<小时/>

编辑2:

我尝试将初始化包装在 bool 值中:

didInsertElement: function () {
    if(!this.get('slidersInitialized')) {
        Ember.run.once(this, 'initSliders');
        this.set('slidersInitialized', true);
    }
}

但这也不起作用。由于 View 被重新渲染，因此 slider 需要再次初始化。

使用计算属性包装正在更新的 View 部分是否会阻止整个 View 重新渲染，从而阻止 slider 的元素被破坏和重新创建？

Answer 1

我找到了问题的答案。

我需要做的就是将值包装在它自己的 View 中，以防止 View 的其余部分被重新渲染:

原始模板:

...
<div class="append field">
    {{input class="narrow input" id="widthInput"  placeholder="Any / Unknown" value=width}}
    <span class="adjoined">{{view.widthInFt}}</span>
</div>
...

新模板:

...
<div class="append field">
    {{input class="narrow input" id="widthInput"  placeholder="Any / Unknown" value=width}}
    {{view view.widthInFtView}}
</div>
...

<script type="text/x-handlebars" id="widthInFt">
    {{view.widthInFt}}
</script>

创建模板后，我在另一个我不想重新渲染的 View 中创建了 View 类作为 subview :

widthInFtView: Ember.View.extend({
    templateName: "widthInFt",
    tagName: "span",
    classNames: ["adjoined"],

    widthInFt: function() {
        var ft = parseInt(this.get('parentView.widthSliderValue') / 12, 10);
        var inches = parseInt(this.get('parentView.widthSliderValue') % 12, 10);
        return ft + " ft. " + inches + " in.";
    }.property('parentView.widthSliderValue')
}),