我正在使用angular2 2.0.0-beta.2和ngrx store
https://github.com/ngrx/store,并在ngrx / store github页面上使用“counter”示例的修改版本实现了一个简单的应用程序.
在我的应用程序中,我有一个“用户”对象,其中有两个用于登录和注销的按钮.我还有相应的reducer函数login和logout,其中我返回一个包含name属性的对象或一个空对象的状态…
export const user: Reducer<any> = (state: any = {},action: Action) => { switch (action.type) { case LOGIN: return {name: 'jdoe'}; case logoUT: return {}; default: return state; } };
这不会更新:
<h2>User Name = {{ user.name | async }}</h2>
…当我点击登录按钮时它仍然是空白的,但是当通过’json’管道传送时,我看到确实对象已经改变了……
这确实更新了
{{ user | async | json }}
…输出{“name”:“jdoe”}但显然这对我没有好处.简单地使用{{user.name | async}}不起作用并保持空白.
模板:
<div> <h2>User Name = {{ user.name | async }}</h2> <button (click)="login()">login</button><button (click)="logout()">logout</button> </div> <hr> <div> {{ user | async | json }} </div>
解决方法
语法看起来像(user | async).name – 参见
http://plnkr.co/edit/OVHh9lHvTU4sKrCbrLqq?p=preview