gpt4 book ai didi

javascript - Ember.js 将 Ember 对象属性绑定(bind)到 Controller 属性?

转载 作者:行者123 更新时间:2023-12-03 06:11:22 24 4
gpt4 key购买 nike

我正在尝试将 Controller 的温度属性绑定(bind)到设置对象的临时属性。我正在 ember 生成的 Controller 文件 app/controllers/home.js 中尝试此操作

var settings = Ember.Object.create({
temp: 66
});

export default Ember.Controller.extend({
temperatureBinding: "settings.temp"
});

在尝试不同的可能解决方案时,我发现当我像这样创 build 置对象时,此代码片段可以工作:

App = Ember.Application.create();

App.settings = Ember.Object.create({
temp: 65
})

App.Controller = Ember.Controller.extend({
temperatureBinding: 'App.settings.temp',
})
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ember Starter Kit</title>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.1/normalize.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://builds.emberjs.com/tags/v1.13.5/ember-template-compiler.js"></script>
<script src="http://builds.emberjs.com/tags/v1.13.5/ember.debug.js"></script>
</head>
<body>

<script type="text/x-handlebars">
Temperature: {{temperature}}
</script>

</body>
</html>

不幸的是,当我在 home.js 文件中尝试执行此操作时,它会抛出错误,因为该文件中未定义 App。这种数据绑定(bind)方式可以用 Ember 实现吗?如果是这样,我做错了什么?

最佳答案

请注意 bindings are deprecated and should not be used .

现在让我们讨论您的示例。第一个示例无法工作,因为无法访问该 settings 变量。这是一个简单的 JavaScript 限制。它只是文件闭包上下文中的一个变量,无法动态访问当前或外部闭包上下文。

因此,如果您只有字符串 "foo",则无法访问变量 foo

第二个示例之所以有效,是因为有一些非常奇怪的魔法,不应该再使用!

基本上,如果绑定(bind)以大写字母开头(例如 A),ember 会尝试在全局 window 上下文中解析它。由于您在本地范围内声明了应用程序(前面没有var),ember可以访问window.App.settings.temp 只需执行 window["App.settings.temp"] 即可。不过,不要使用它!

<小时/>

应该使用的是计算属性和服务。如果您有一些全局状态,请为其创建一个服务!因此,不要使用大写字母的绑定(bind),而是使用服务!

当您只想要一个简单的别名时,您不必编写 this.get('foo.bar') 而只想编写 this.get('bar' ) 你应该通过计算属性来完成它。

而不是

barBinding: 'foo.bar',

bar: Ember.computed.alias('foo.bar'),

您可以将其与服务结合起来,以获得类似于大写字母绑定(bind)的内容:

myService: Ember.inject.service(),
foo: Ember.computed.alias('myService.foo'),

如果这样做,您将拥有 foo 属性,它是服务上 foo 属性的别名,因此是全局的。

<小时/>

但是,您始终可以做的就是将变量放入 ember 对象中:

var settings = {foo: 12};
export default Ember.Controller.export({
settings:settings,
foo: Ember.computed.alias('settings.foo'),
});

这将按预期工作,除了一件事:设置对象不是 ember 对象,因此不可观察。如果您执行 settings.foo=42; foo 计算属性将不会更新

关于javascript - Ember.js 将 Ember 对象属性绑定(bind)到 Controller 属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39299997/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com