作为组件参数传递的对象键的计算属性

I have a messages service that will eventually get messages saved in the database and set them globally for the user but for now I have them set like so

我有一个消息服务，最终会将消息保存在数据库中，并为用户全局设置它们，但是现在我将它们设置为如此

  messages: [
    Ember.Object.create({
      id: 1,
      name: "Out Bid",
      body: "You've been out bid on an item",
      read: false,
      seen: false
    }),
    Ember.Object.create({
      id: 2,
      name: "Out Bid",
      body: "You've been out bid on an item, You've been out bid on an item",
      read: true,
      seen: false
    })
  ],

I have some computed that will tell me how many of these messages have not been marked as seen and when I click on this bubble that shows if that number is over 0 I go to a messages route. In the messages route I inject the messages service and set the model equal to the messages that the service has in it

我有一些计算器将告诉我有多少这些消息没有被标记为已经看到，当我点击这个气泡，显示该数字是否超过0我进入消息路由。在消息路由中，我注入消息服务并将模型设置为等于服务在其中的消息

model() {
    return this.get('messages').get('messages');
}

This route displays the messages in an each loop that renders a component

此路由显示呈现组件的每个循环中的消息

{{#each model key="id" as |message|}}
    {{message-item message=message}}
{{/each}}

In the component I am trying to add the unread class like so

在组件中，我试图像这样添加未读类

classNameBindings: ['unread'],
unread: Ember.computed('message.unread',function(){
    return this.get('message').get('read') === false;
}),

And that is working, however when I fire the click action to show the message in a modal and therefore mark it as read the computed is not updating

这是有效的，但是当我触发单击操作以在模态中显示消息并因此将其标记为已读时计算机未更新

click() {
    var message = this.get('message');
    this.get('notification').notify({message: message.get('body')});
    message.set('read',true);
}

If I console.log the value of message.get('read') before and after I set it, I see that it is properly being set, but the template is not updating the computed to remove the unread class after it's marked read.

如果我在设置它之前和之后我将console.log的值设置为message.get（'read'），我看到它已正确设置，但模板未更新计算机以在标记为read后删除未读类。

1 个解决方案

#1

You watch wrong property. Watch read instead of unread:

你看错了财产。观看阅读而不是未读：

classNameBindings: ['unread'],
unread: Ember.computed('message.read',function(){
    return this.get('message').get('read') === false;
}),