关于如何从组件1通知组件2已经更新数据并且你应该在没有刷新的情况下绑定它,我几周都陷入困境。我会通知你我的代码也许有人可以知道我的概念有什么问题。
我有两个组件(新闻提要)和(帖子)。
新闻feed.component.ts:
修改
这是get sharedData
get sharedData() //<--a getter
{
return this._newElement.sharedData;
}
这是ngOnInit()
ngOnInit() {
this._newElement.data.subscribe((param: any) => { //<--subscribe to an observable
this.data=param;
});
在我的帖子组件onsuccess中,我使用了this._newElement.change(this.result.data);
在newsFeed()this._newElement.sharedData=this.result.data.posts;
和我的html中,我将data
替换为sharedData
。
编辑结束
newsFeed() {
this._newsFeedService.newsFeedService(this.user)
.subscribe(
response => {
this.result = response;
if (this.result.code == -502) {
// error
}
} else if (this.result.code == 1) {
this.data = [] = this.data || [];
this.result.data.posts.forEach(item => {
this.data.push(item);
});
}
else {
this.alert = this._appService.newAlert('danger', this.result.msg);
}
},
error => console.log(error)
);
}
新闻feed.service.ts:
@Injectable()
export class NewsFeedService {
private newsFeedAPI = AppGlobals.API_URL + 'news_feed/news-feed.php';
constructor(private _appService: AppService) {
}
newsFeedService(value: Object) {
return this._appService.LoadAPI(value, this.newsFeedAPI);
}
}
新闻feed.ts:
export class NewsFeed {
user_id: string;
session_key: string;
page: number;
postText: string;
postID: any;
constructor() {
}
}
这是我上面使用的LoadAPI()
,它位于app.service.ts:
public LoadAPI(data: Object, API: string): Observable<any> {
const headers = new Headers();
headers.append('Content-Type',
'application/x-www-form-urlencoded;charset=utf-8');
return this._http.post(API, data, {
headers: headers
}).map(res => res.json());
}
现在在我的html中我像往常一样显示数据:
<div *ngFor="let item of sharedData" id="{{item.post_id}}" class="post_{{item.post_id}}">
<article class="hentry post card_{{item.post_id}}">
//data
</article>
</div>
最大的问题是:
在post.component.ts
我有insertPost()
函数和onSuccess中,它会返回news-feed.component
应检测到的新数据。主要想法是什么?