显示引号列表中的随机引用

Question

以下是我的实施，

MyApp.QuoteList = [
  {name: "The first Quote", author: "author-1"},
  {name: "The second Quote", author: "author-2"},
  {name: "The third Quote", author: "author-3"},
  {name: "The fourth Quote", author: "author-4"},
  {name: "The fifth Quote", author: "author-5"}
]

MyApp.getRandomQuote = function(){
  index = Number(Math.random()*(MyApp.QuoteList.length-1)).toFixed(0);
  MyApp.set('currentQuote', MyApp.Quotes[index]);
}

MyApp.QuotesContainer = Ember.ContainerView.extend({
  didInsertElement: function(){
    this.set('intervalId', setInterval(MyApp.getRandomQuote, 3000));
  },

  currentViewBinding: 'currentQuoteView',

  setCurrentQuoteView: function(){
    htmlContent = "
      <span>{{MyApp.get('currentQuote.name')}}</span>
      <span> -- {{MyApp.get('currentQuote.author')}} </span>
    ";
    view = Ember.View.create({
      template: Ember.Handlebars.compile(htmlContent))
    });
    this.set('currentQuoteView', view);
  }.observes('MyApp.currentQuote'),

  willDestroyElement: function(){
    clearInterval(this.get('intervalId'));
  }
})

我知道这不是最好的实施方式，关于如何在处理子视图列表时即兴创作或最小化的任何想法

PS 我也有fadeIn＆amp;我省略了每个子视图的fadeOut过渡，我实际上可以使用Ember.View来完成此操作，只需使用setInterval更改绑定属性，但在这种情况下我无法添加fadeIn＆amp; fadeOut动画或我们可以吗？