0

テンプレートを 3 秒ごとにローテーションする小さな Ember View ウィジェットを作成しようとしています。これは私が得た限りですが、正しく機能していないようです。私は正しいアプローチをとっていますか、それとも誰かがこれを行う方法を提案できますか?

更新しました：

これはほとんど機能しますが、頻繁に更新されるため、テンプレートを正しく循環しません。ここに jsfiddle があります。(警告、Fiddle は DOM への更新で過負荷になるため、最終的に応答しなくなります)

App.RotatingView = Ember.View.extend
  templateString: null
  views: ["a", "b", "c"]

  init: ->
    @set 'templateString', @_getNextTemplate()
    @_super()

  template: (->
    Ember.Handlebars.compile(@get 'templateString')
  ).property('templateString')

  templateDidChange: (->
    setInterval =>
      @set 'templateString', @_getNextTemplate()
      Ember.run.next => @rerender()
    , 3000
  ).observes("templateString")

  _getNextTemplate: ->
    views = @get('views')
    length = views.length

    currentTemplateIndex = views.indexOf this.get('templateString')

    if (currentTemplateIndex + 1) == length
      return views[0]
    else
      return views[currentTemplateIndex + 1]

更新 #2

以下の@Unspecifiedで提案されたアプローチも試みましたContainerViewが、「未定義のメソッド「childViewsDidChange」を呼び出せません。

App.RotatingView = Ember.ContainerView.extend
  views: Em.A(["a", "b", "c"])

  childViews: (->
    views = @get('views')
    return views.map (view) -> Ember.View.create({template: Ember.Handlebars.compile(view)})
  ).property('views.@each')

  init: ->
    @set 'currentView', @get('childViews.firstObject')
    @_super()

  viewDidChange: (->
    setInterval =>
      @set 'currentView', @_getNextView()
    , 3000
  ).observes('currentView')

  _getNextView: ->
    views = @get('childViews')
    length = views.length

    currentTemplateIndex = views.indexOf this.get('templateString')

    if (currentTemplateIndex + 1) == length
      return views[0]
    else
      return views[currentTemplateIndex + 1]
4

2 に答える 2

2

あなたの templateDidChange メソッドには問題がありobserves('templateString')ます.

これは、期待どおりに機能するように見えるフィドルです。 setInterval をメソッドに移動しただけですinit。

于 2013-05-28T07:13:17.803 に答える