Ember JS-組件所有實例的Update屬性

Question

是否可以在組件的所有實例上更新屬性？

如果頁面上下面有10個該組件的實例，我想將所有這些實例的currentTrack屬性設置為false。 這可能嗎？ 可以從其中一個組件內部完成嗎？

import Ember from 'ember';

export default Ember.Component.extend({

    currentTrack: true,

});

我正在使用Ember 2.12

Answer 1

您可以在此用例中使用Ember.Evented 。

在這里，有一個簡單的旋轉 。

Answer 2

template.hbs

{{your-component-name currentTrack=currentTrack}}
{{your-component-name currentTrack=currentTrack}}
{{your-component-name currentTrack=currentTrack}}
// btn for disabling 
<a href="#" class="btn" onclick={{action 'makeAllcurrentTracksFalse'}}>To false</a>

controller.js

currentTrack: true,
actions: {
    makeAllcurrentTracksFalse() {this.set('currentTrack', false)}
}

或在your-component-name.js中-您可以使用與上述相同的操作，它將應用於所有組件

Answer 3

您如何為要實現的目標創建條目。

const SongEntry = Ember.Object.extend({ 

});

要創建一個條目，您將調用該條目（可能是在播放列表中添加歌曲嗎？）

  songs: [],

  addNewSongToList: function(songName) {
       const newEntry = MyMusicEntry.create({
           isCurrent: false,
           title: songName
       });

       this.get('songs').pushObject(newEntry);
  },

  activateNewSong: function(newSongToActivate) {
     this.get('songs').forEach(s => s.set('isCurrent', false);

     newSongToActivate.set('isCurrent', true)
  }

模板看起來像這樣

 {{each songs as |song|}}
     {{my-song-component songEntry=song changeSong=(action "activateNewSong")}}
 {{/each}}

//my-song-component.js

<div class="song-layout" {{action "changeSong" song}}>