我们可以从 SCSS 文件中的角度获取动态值吗？答案

【问题标题】：Can we get dynamic value from angular in SCSS file [duplicate]我们可以从 SCSS 文件中的角度获取动态值吗？
【发布时间】：2016-07-05 11:10:23
【问题描述】：

基本上我想根据用户选择为每个元素使用背景颜色，用户选择将存储在数据库中。用户应根据其颜色配置文件创建网页。因此，我需要一个想法来从 angular 获取该值并将其值存储在 scss 变量中并进行渲染。

【问题讨论】：

【解决方案1】：

SCSS 是一个预处理器，当你使用 SCSS 时，它实际上会被编译成 CSS，这就是你使用的东西。

也许最好的解决方案是在您需要的部分中使用ngStyle..body、div 或任何您想要的地方..

例子

<div ng-style="userStyle">
...
</div>

在你的 JS 中

$scope.userInfo = { backgroundColor: 'red' };
$scope.userStyle = {'background-color': $scope.userInfo.backgroundColor};

假设您有一个 userInfo 对象，具有 backgroundColor 属性。

【讨论】：

【解决方案2】：

这是不可能的，angular是javascript代码并在客户端浏览器中运行，sass被预编译为css，任何变量都将在浏览器中呈现之前转换为完整值。

您需要获取 angular 来调用您的服务器，并让服务器根据 angular 提供的值动态生成 CSS 文件。（我想您也可以在客户端上执行此操作，我确信某处有一个 javascript 库可以让您编译 sass）

【讨论】：

【解决方案3】：

scss在构建之前编译成css，所以angular部分无法控制scss。您可以使用 gulp/grunt 来编辑 scss 变量。但在你的情况下它没有帮助。

对你来说最简单的办法是使用 ng-style。 <div ng-style="{'background-color': scopeUserColor}"><div\>

【讨论】：