Question

可能重复：
Using Ember.js, how do I run some js after a view is rendered?

我使用JWPlayer在我的网站上显示视频，JWPlayer使用javascript创建查看器。

我的隐藏视图更改为show后，我必须运行JWPlayer脚本。

jwplayer('video_space').setup({
    'flashplayer': 'player.swf',
    'file': 'http://content.longtailvideo.com/videos/flvplayer.flv',
    'controlbar': 'bottom',
    'width': '470',
    'height': '320'
  });

我将视图与控制器上的值绑定

<script type="text/x-handlebars" >
  {{#view Food.previewView }}
    Video session
    <div {{bindAttr class="showPreview"}}>
        <div id='video_space'>Video Loading...</div>
    </div>
    {{#view SC.Button target="Food.appController" action="show"}}
        show
    {{/view}} 
  {{/view}}
</script>

我的所有控制器和视图的javascript

Food = Ember.Application.create();

Food.appController = Ember.Object.create({
    showVideo: false,

    show: function(){
        Food.previewView.set('showVideo', true);
    }
});

Food.previewView = Ember.View.extend({
    showVideoBinding: 'Food.appController.showVideo',

    showPreview: function() {
        return this.get('showVideo') ? "show" : "hide";
    }.property('showVideo')
});

如果我在更改＆＃34; showVideo＆＃34;时运行JWPlayer脚本变量视频会出错，因为$（＆＃39;＃video_space＆＃39;）仍然是隐藏的。

Emberjs有一些委托方法，如＆＃34; afterViewChange＆＃34;或＆＃34; viewDidChange＆＃34; ？

测试代码 http://jsfiddle.net/apirak/Ay6Fh/

Answer 1

重写Ember.View.didInsertElement函数并将自定义项放在那里。

http://docs.emberjs.com/#doc=Ember.View&method=didInsertElement&src=false

Answer 2

有一件事，你在创建appController时出错，在创建你需要使用的对象.create而不是.extend时，这个错误导致按钮没有找到你控制器的“show”动作。

也就是说，你仍然可以在showVideo上绑定你的动作，当它改变时你可以调用你的JWPlayer脚本来显示它。

如何在视图完成渲染更改后运行函数

2 个答案: