मैं एक कोणीय 2 ऐप विकसित कर रहा हूं, मुझे सूची में अपने कॉलम का क्रम बदलने, शीर्षक (डेटा-टेबल कार्यों के रूप में) पर क्लिक करने की आवश्यकता है और मुझे Angularfire 2 दस्तावेज़ उदाहरणों से एक विचार मिलता है, यह मेरा कोड है : (grupos.component.ts)विषय RxJS को देखने योग्य प्रारंभिक मान कैसे असाइन करें?
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" (विषय) के लिए प्रारंभिक मान देने के लिए घंटों की खोज कर रहा हूं, मुझे "evento" पर मान असाइन करना पसंद है, इसलिए तालिका को इवेंटो द्वारा आदेश दिया गया है जैसा कि मैंने इसे दिखाया है। अब तक मुझे बटन शीर्षक और तालिका खाली में दिखाएं, और यदि मैं किसी भी बटन पर क्लिक करता हूं, तो यह मुझे उस क्रम में तालिका दिखाता है।
कोई सुझाव, या टिप्पणियों की सराहना की जाएगी!
हाँ आदमी, आपका अधिकार !, क्योंकि विषय मूल्य स्वीकार नहीं करता है, आपकी टिप के लिए बहुत बहुत धन्यवाद ... – CaribeSoft