refactor(services): add use of observables

This commit is contained in:
Dmitry Nehaychik 2017-07-13 18:34:57 +03:00
parent c86e92a9a9
commit f690da083e
3 changed files with 45 additions and 33 deletions

View file

@ -1,4 +1,6 @@
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
let counter = 0;
@ -20,16 +22,16 @@ export class UserService {
// this.userArray = Object.values(this.users);
}
getUsers() {
return this.users;
getUsers(): Observable<any> {
return Observable.of(this.users);
}
getUserArray() {
return this.userArray;
getUserArray(): Observable<any[]> {
return Observable.of(this.userArray);
}
getUser() {
getUser(): Observable<any> {
counter = (counter + 1) % this.userArray.length;
return this.userArray[counter];
return Observable.of(this.userArray[counter]);
}
}

View file

@ -1,4 +1,4 @@
import { Component } from '@angular/core';
import { Component, OnInit } from '@angular/core';
import { NgaSidebarService, NgaMenuService } from '@akveo/nga-theme';
import { NgaThemeService } from '@akveo/nga-theme/services/theme.service';
@ -23,13 +23,13 @@ import { UserService } from '../../../@core/data/users.service';
<nga-action icon="ion-ios-email-outline"></nga-action>
<nga-action disabled icon="ion-ios-bell-outline"></nga-action>
<nga-action>
<nga-user [menu]="userMenu" [name]="user.name" [picture]="user.picture"></nga-user>
<nga-user [menu]="userMenu" [name]="user?.name" [picture]="user?.picture"></nga-user>
</nga-action>
<nga-action icon="ion-ios-gear-outline"></nga-action>
</nga-actions>
`,
})
export class HeaderComponent {
export class HeaderComponent implements OnInit {
user: any;
@ -46,7 +46,11 @@ export class HeaderComponent {
private menuService: NgaMenuService,
private themeService: NgaThemeService,
private userService: UserService) {
this.user = this.userService.getUsers().nick;
}
ngOnInit() {
this.userService.getUsers()
.subscribe((users: any) => this.user = users.nick);
}
toggleSidebar(): boolean {

View file

@ -1,4 +1,4 @@
import { Component } from '@angular/core';
import { Component, OnInit } from '@angular/core';
import { UserService } from '../../../@core/data/users.service';
@ -7,33 +7,39 @@ import { UserService } from '../../../@core/data/users.service';
styleUrls: ['./contacts.component.scss'],
templateUrl: './contacts.component.html',
})
export class ContactsComponent {
export class ContactsComponent implements OnInit {
contacts: any[];
recent: any[];
constructor(private userService: UserService) {
const users = this.userService.getUsers();
this.contacts = [
{ user: users.nick, type: 'mobile' },
{ user: users.eva, type: 'home' },
{ user: users.jack, type: 'mobile' },
{ user: users.lee, type: 'mobile' },
{ user: users.alan, type: 'home' },
{ user: users.kate, type: 'work' },
];
this.recent = [
{ user: users.alan, type: 'home', time: '9:12 pm' },
{ user: users.eva, type: 'home', time: '7:45 pm' },
{ user: users.nick, type: 'mobile', time: '5:29 pm' },
{ user: users.lee, type: 'mobile', time: '11:24 am' },
{ user: users.jack, type: 'mobile', time: '10:45 am' },
{ user: users.kate, type: 'work', time: '9:42 am' },
{ user: users.kate, type: 'work', time: '9:31 am' },
{ user: users.jack, type: 'mobile', time: '8:01 am' },
];
}
ngOnInit() {
this.userService.getUsers()
.subscribe((users: any) => {
this.contacts = [
{user: users.nick, type: 'mobile'},
{user: users.eva, type: 'home'},
{user: users.jack, type: 'mobile'},
{user: users.lee, type: 'mobile'},
{user: users.alan, type: 'home'},
{user: users.kate, type: 'work'},
];
this.recent = [
{user: users.alan, type: 'home', time: '9:12 pm'},
{user: users.eva, type: 'home', time: '7:45 pm'},
{user: users.nick, type: 'mobile', time: '5:29 pm'},
{user: users.lee, type: 'mobile', time: '11:24 am'},
{user: users.jack, type: 'mobile', time: '10:45 am'},
{user: users.kate, type: 'work', time: '9:42 am'},
{user: users.kate, type: 'work', time: '9:31 am'},
{user: users.jack, type: 'mobile', time: '8:01 am'},
];
});
}
}