Question

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

不幸的是，我还在更新页面上的计算属性，并且当计算属性更新时，滑块重新初始化，因为didInsertElement函数再次触发。

在视图中打印之后是否有一个触发的函数，因此我可以初始化我的滑块，但不是每次更改页面，或者元素被删除或去掉？

编辑：

我试过了：

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

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

编辑2：

我尝试用布尔值包装初始化：

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

但这也行不通。由于视图已重新渲染，因此需要再次初始化滑块。

使用计算属性包装正在更新的视图部分是否会阻止整个视图被重新呈现，从而阻止滑块的元素被销毁和重新创建？

Answer 1

我发现了我的问题的答案。

我需要做的就是将值包装在自己的视图中，以防止视图的其余部分被重新呈现：

原始模板：

...
<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>

在我创建模板后，我在另一个视图中创建了一个视图类，我不想再被渲染：

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')
}),

如何在init之后更新视图，但不使用didInsertElement（）？

1 个答案: