2017-04-03 49 views
0

从ngrx商店中选择一个对象时,我们没有得到该类的实例,而是获得了具有相同属性的对象。这可以防止在对象上调用函数。从ngrx商店获取模型实例选择

我应该在subscibe函数内创建一个实例吗?我只是想知道我没有找到关于这个主题的任何内容,并且想知道什么是最佳实践。

class ItemModel { 
    name: string; 

    formatedName() { 
    return this.name.upperCass(); // always undefined 
    } 
} 

class AnyClass { 
    item: ItemModel; 

    construtor() { 
    this.store.select(state => state.item).subscribe(item => this.item = item); 
    } 

    func() { 
    this.item.formatedName(); 
    } 
} 

回答

2

关于你的代码剪断至少有一个问题: 您需要使用this的名称。 。

formatedName() { 
    return >>this.<<name.toUpperCase(); // always undefined 
} 

(不知道这只是在你的SO或也在这里剪断就在你的代码


但是:所以一般不建议有类实例在店有几条经验法则:

  1. 商店内容应该序列化的,没有任何大的改动(=>只使用对象和基本类型)
  2. ngrx(和一般的rxjs)在很大程度上依赖于函数式编程模式,所以不建议将它混合到面向对象的范例中。

既然你没有提供任何进一步的细节我必须假设你的具体情况有关格式化字符串(如为大写),我会建议你使用模板管为:

<span>{{item | myFormatToUpperCasePipe}}</span> 

,我会去,甚至更进一步,利用async - 管以及:

class MyComponent { 
    item$ = this.store.select(state => state.item); 
} 

// template: 
<span>{{item$ | async | myFormatToUpperCasePipe}}</span> 

在你不需要在模板此信息的情况下,我的问题是:你为什么需要f ormat的东西不显示在UI中? 但即使在这种情况下,我建议你保留功能模式并使用实用程序方法来转换数据 - 甚至可能作为rxjs流的一部分。

+0

谢谢。大写函数只是一个简单的例子。我有一个有很多价值的模型。有些是基于其他值计算的。我不想在组件内部使用这种逻辑,因为它在多个组件中使用。我不想使用管道,因为它不仅显示在UI中,而且还发送到服务器。所以把它放到模型中并写一个'get'函数似乎是正确的,并且在我使用商店之前工作得很好。 – MarcS82

+0

但我看到你的观点,所以也许我会写静态函数来计算值。 – MarcS82

+1

如果你有很多计算字段,并需要计算的值在许多地方,也许你可以设置一个映射流'store.select(.. item).map(toFormattedItem).subscribe(...)' - >作为一个有利的一面-effect:'toFormattedItem()'将非常容易编写单元测试 – olsn