Subject RxJS observableに初期値を割り当てる方法は？

Question

私はAngular 2アプリを開発しています。リスト内の列の順序を変更し、タイトルをクリックする必要があります（データテーブルの動作として）、Angularfire 2のドキュメントの例からアイデアを得ました。 ：ここでは（grupos.component.ts）

import { Component, OnInit } from '@angular/core'; 
import { AngularFire, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2'; 
import { Subject } from 'rxjs/Subject'; 
import {AF} from "../providers/af"; 
import { Router } from "@angular/router"; 
{ EditGpoComponent } from '../edit-gpo/edit-gpo.component'; 

@Component({ 
    selector: 'app-grupos', 
    templateUrl: './grupos.component.html', 
    styleUrls: ['./grupos.component.css'] 
}) 

export class GruposComponent implements OnInit { 
    public newMessage: string; 
    eventos: FirebaseListObservable<any[]>; 
    sizeSubject: Subject <any>; 

constructor(af: AngularFire, private router: Router) { 
    this.sizeSubject = new Subject(); 
    this.eventos = af.database.list('/eventos', { 
      query: { 
      orderByChild: this.sizeSubject 

      } 
     }); 
    } 

    filterBy(size: string) { 
    this.sizeSubject.next(size); 

    } 

    editaGrupo(keyGrupo){ 

    this.router.navigate(['/add-gpo']); 
    } 

    ngOnInit() { 

    } 

} 

は私Grupos.components.htmlのコードです：

<div class="container"> 


<br><br><br> 
    <div class="row"> 
    <a href="#" class="btn btn-info" routerLink="/add-gpo">+Add New Event</a> 
    <br><br> 
    <table class="table table-striped"> 
    <thead> 
    <tr> 
    <th><button (click)="filterBy('evento')">EVENT</button></th> 
    <th><button (click)="filterBy('arrival')">ARRIVAL</button></th> 
    <th><button (click)="filterBy('departure')">DEPARTURE</button></th> 
    <th><button (click)="filterBy('hotel')">VENUE</button></th> 
    <th><button (click)="filterBy('pax')">PAX</button></th> 
    <th>FUNCTIONS</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr *ngFor="let evento of eventos | async "> 
     <td>{{evento.evento}}</td> 
     <td>{{evento.arrival}}</td> 
     <td>{{evento.departure}}</td> 
     <td>{{evento.hotel}}</td> 
     <td>{{evento.pax}}</td> 
     <td style="font-size: 1.2em"> 
     <a href="#" [routerLink]="['/editGpo']" [queryParams]="{eveId: evento.$key}"><span class="glyphicon glyphicon-edit" aria-hidden="true" title="edit event"></span></a> 
     <a href="#"><span class="glyphicon glyphicon-user" aria-hidden="true" title="attendees"></span></a> 
     <a href="#"><span class="glyphicon glyphicon-bullhorn" aria-hidden="true" title="speakers"></span></a> 
     <a href="#"><span class="glyphicon glyphicon-trash glyphicon " aria-hidden="true" title="delete event"></span></a> 

     </td> 
    </tr> 
    </tbody> 

</table> 
</div> 
</div> 

あなたは私がコラムのタイトルをクリックすると、そのかなりクールな作業、毎回見ての通りボタン、私のテーブルは、その列の順序を取得します。しかし、私は "sizeSubject"（Subject）に初期値を与える方法について何時間も探していました。私は "evento"の値を割り当てたいので、テーブルはeventoの順番で表示されます。ここでは、ボタンのタイトルと表を空白で表示しています。ボタンをクリックすると、その順に表が表示されます。

ご意見やご感想をお寄せください。

Answer 1

「初期値」を持つサブジェクトが必要な場合、使用するRxJSクラスはBehaviorSubjectです。

BehaviorSubjectでは、初期値をコンストラクタに渡します。