Ember组件可以观察控制器属性吗?

Dar*_*han 11 ember.js

我有一个控制器和一个组件.在呈现组件时,它以这种方式传递:

{{modal-filter feature=feature parentController=this.controller}}
Run Code Online (Sandbox Code Playgroud)

其中feature是通过控制器传递给handlebars的param,而parentController是控制器.

现在,在控制器本身中,有一个属性(数组).让我们调用该数组requiredValues.

现在在控制器/组件本身内,我们可以轻松设置:

valueObserver : function(){
     ...
}.observes('requiredValues')
Run Code Online (Sandbox Code Playgroud)

但是,我需要从模态过滤器组件中观察此控制器属性.所以在模态过滤器组件中,我将作为观察者函数放置什么:

valueObserver : function(){
     ...
}.observes(???)
Run Code Online (Sandbox Code Playgroud)

小智 22

将整个控制器传递给组件是一种巨大的代码味道.它违反了组件封装的基本原则.如果"组件"与控制器紧密耦合,那么它就是一个视图,只需说出即可从中访问控制器this.controller.组件的输入应严格通过调用时传入的参数.组件的输出是通过 send,控制器可以通过说明在其视图的模板中映射到它选择的某些行为{{my-component action='eraseHardDisk'}}.

您无需在组件内直接观察控制器上的任何内容.如果用组件调用组件{{my-component param=someProperty}},则对控制器的任何更改someProperty都将自动传播到param组件的组件.然后,组件可以定义一些计算属性param,或者观察它,或者在它自己的模板中使用它,它将自动保持最新.

  • 感谢您让我知道这段代码的味道.我确实重构了我的代码,只将所需数据作为params传递,并通过sendAction()函数发送输出.你是对的 - 组件应该是独立的; 我读到某个地方组件知道控制器,但控制器不知道组件,我误解了它.谢谢; 非常感激. (2认同)

Kin*_*n2k 16

你应该做什么,但我会告诉你如何完整

如果您正在通过控制器,您可以只在parentController酒店看一个项目,但我根本不会推荐这个.

valueObserver : function(){
     ...
}.observes('parentController.requiredValues')
Run Code Online (Sandbox Code Playgroud)

这将假设整个阵列正在被替换,而不仅仅是添加或更改的项目.

项目已添加或已删除

valueObserver : function(){
     ...
}.observes('parentController.requiredValues.[]')
Run Code Online (Sandbox Code Playgroud)

项目属性foo在其中一个requiredValues项目上更改

valueObserver : function(){
     ...
}.observes('parentController.requiredValues.@each.foo')
Run Code Online (Sandbox Code Playgroud)

你应该做什么

不要传入控制器,只需传入属性,然后观察属性.

{{modal-filter feature=feature property=someProperty}}


propertyObserver : Ember.observer('property', function(){
     ...
})
Run Code Online (Sandbox Code Playgroud)