我将数据放入服务中,因此如果更改了每个组件,请听取它并使用新数据更新其组件。
但是所有内容都连接在一起,我没有收到任何错误,但是当它被解雇时它没有收到该事件!
这是服务:
import {EventEmitter, Injectable} from 'angular2/angular2';
import {PlayerModel} from '../../models/players/players.ts';
@Injectable()
export class PlayerService {
playerListModified: EventEmitter = new EventEmitter();
players: Array<PlayerModel> = new Array<PlayerModel>();
addPlayer(player: PlayerModel) {
this.players.push(player);
this.playerListModified.next(this.players);
}
}
Here is the Component that Listen to the Service Change
import {Component, Input, NgFor} from 'angular2/angular2';
import {PlayerModel} from '../../models/players/player.ts';
import {PlayerService} from '../../services/players/playerService.ts';
@Component({
selector: 'best-score-board',
templateUrl: 'app/components/leaderboards/bestScoreBoard.html',
directives: [NgFor],
providers: [PlayerService]
})
export class BestScoreBoardComponent {
players: Array<PlayerModel>;
constructor(playerService: PlayerService) {
playerService.playerListModified.observer({
next: (players) => console.log('test2')
});
this.players = playerService.players;
}
}
What am i doing wrong ?
**EDIT**
Here is where i call the service
import {Component, Output, EventEmitter} from 'angular2/angular2';
import {PlayerModel} from '../../models/players/player.ts';
import {PlayerService} from '../../services/players/playerService.ts';
@Component({
selector: 'create-player-form',
templateUrl: 'app/components/players/createPlayerForm.html',
providers: [PlayerService]
})
export class CreatePlayerFormComponent {
playerService: PlayerService;
constructor(playerService: PlayerService) {
this.playerService = playerService;
}
createPlayer(name, score) {
this.playerService.addPlayer(new PlayerModel(name.value, score.value));
name.value = '';
score.value = '0';
}
}
如果我在我的服务中执行console.log,我会收到PlayerModel。
答案 0 :(得分:3)
将providers
添加到Component
装饰器中的ProviderService
时,会为此组件(及其子组件)创建@Component({
// ...
// new instance of PlayerService will be created
// for BestScoreBoardComponent
providers: [PlayerService]
})
export class BestScoreBoardComponent { /* ... */ }
@Component({
// ...
// and again new instance of PlayerService will be created
// at this time for CreatePlayerFormComponent
providers: [PlayerService]
})
export class CreatePlayerFormComponent { /* ... */ }
的新实例。
PlayerService
如果要对这两个组件使用providers
的单个实例,则应在其公共父组件的bootstrap
或@Component({
// ...
// providers: [PlayerService] <- you should remove this line
})
export class BestScoreBoardComponent { /* ... */ }
@Component({
// ...
// providers: [PlayerService] <- and this line too
})
export class CreatePlayerFormComponent { /* ... */ }
// ...
bootstrap(AppComponent, [PlayerService]); // <-- Here you go.
函数中指定它。
Handler handler;
@Override
protected void onCreate(Bundle savedInstanceState)
{
....
handler = new Handler();
}
@Override
protected void onResume()
{
....
handler.postDelayed(myRunnable, 60 * 1000);
}
@Override
protected void onPause()
{
....
handler.removeCallbacks(myRunnable);
}
private final Runnable myRunnable= new Runnable() {
@Override
public void run()
{
downloadNewJsonData();
adapter.notifyDataSetChanged();
handler.postDelayed(myRunnable, 60 * 1000);
}
}