我想将文本输入与 CSS 链接起来,以重新创建 WordPress 主题(实时)定制器,其中更改输入中的值会更新特定的 CSS 值。
我在模板中创建了一个 {{ Ember.TextField }} 和 <style>
使用正确的 CSS 声明(其中包含 Ember 变量)标记,以更新 CSS。我收到一条错误消息,告诉我 Ember 无法访问我的 <style>
中的变量标签,因为它不在 DOM 之外;这是有道理的,生成的代码是 <script>
里面 <style>
在另一个里面<script>
,有点丑。
我想知道是否有一种(干净的)Ember 方式将输入/文本区域/选择字段与 CSS 属性链接起来。我读过Ember.js - Update CSS width based on an object property ,但是向我想要更新的每个标签添加 {{bindAttr}} 可能会适得其反,因此我询问 Ember 专家是否有办法以某种方式将所有这些更改分组来完成我需要的操作。
否则,我想这将是一个 jQuery 自制插件,但我更愿意在放弃 Ember 魔法之前完全确定这样做;)
谢谢!
最佳答案
我认为在这种情况下使用观察者会很好。
App.StyleTextField = Ember.TextField.extend({
valueDidChange: function() {
var value = this.get('value');
var cssText = 'h1 { color: ' + value + '; }'; // You could even use Mustache to generate this if you were so inclined
// create a <style /> tag with cssText and dump it into the <head />
}.observes('value')
});
关于css - 使用 Ember.js 更新 CSS 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15260521/