首页 > 解决方案 > 转换为 Glimmer 组件——服务中的动态属性

问题描述

我正在尝试构建一个 Glimmer 组件,该组件对服务中的属性更改做出反应,请参见下面我试图让组件更新 get 播放以响应 audioPlayer url 和状态的更改——播放时更改在下面的播放操作中按下按钮....这不起作用,我无法找到任何文档来支持这种类型的行为。

import { action } from '@ember/object';
import { inject as service } from '@ember/service'; 

export default class ShowAudioEpisodeComponent extends Component {
  
  @service audioPlayer;
  
  get playing() {
    return this.audioPlayer.url == this.args.epi.audioUrl && this.audioPlayer.status == "playing";
  }

  @action
  play() {
    if (this.playing) {
      this.audioPlayer.pause(this.args.epi);
    } else {
      this.audioPlayer.playEpisode(this.args.epi);
    }
  }

}

标签: ember.jsglimmer.js

解决方案


audio-player服务必须声明urland statusas @tracked,或者必须始终使用更新它们set


推荐阅读