如何在ember js中动态更改app.scss的值

在Ember.js中动态更改app.scss的值可以通过以下步骤实现：

1. 创建一个全局的样式变量文件，例如app.scss，用于存储需要动态更改的样式值。
2. 在app.scss中定义需要动态更改的样式变量，例如：

$primary-color: #ff0000;

1. 在需要动态更改样式的组件中，使用ember-computed插件创建一个计算属性，用于获取动态的样式值。例如，在my-component.js中：

import Ember from 'ember';
import computed from 'ember-computed';

export default Ember.Component.extend({
  dynamicStyle: computed(function() {
    // 在这里根据需要的逻辑计算动态的样式值
    return `background-color: ${this.get('dynamicColor')};`;
  }),

  dynamicColor: 'red', // 默认的动态颜色

  actions: {
    changeColor(color) {
      this.set('dynamicColor', color);
    }
  }
});

1. 在模板文件中，使用style绑定将动态样式应用到元素上。例如，在my-component.hbs中：

<div style={{dynamicStyle}}>
  <!-- 内容 -->
</div>

1. 在需要更改样式的地方，调用changeColor动作来更新动态颜色。例如，在另一个组件或控制器中：

this.send('changeColor', '#00ff00');

这样，当调用changeColor动作时，dynamicStyle计算属性会重新计算，并将新的动态样式应用到元素上。

请注意，以上示例中使用了ember-computed插件来创建计算属性，你需要在项目中安装并导入该插件。此外，动态更改样式的逻辑可以根据具体需求进行调整。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云对象存储（COS）。

• 腾讯云云服务器（CVM）：提供可扩展的云服务器实例，适用于各种计算场景。详情请参考腾讯云云服务器。
• 腾讯云对象存储（COS）：提供安全、稳定、低成本的对象存储服务，适用于存储和处理大规模非结构化数据。详情请参考腾讯云对象存储。