Search the Community

ищу работу angular2-разработчика. пример лучшего кода здесь: https://github.com/zlodiak/ng2_answers_web контакты: email: kalinin.sergey.81@gmail.com skype: cyklop771

Подскажите пожалуйста как в angular2 при помощи rxjs через каждые 5 секунд получать данные с сервера. Вот мой код, он работает, но есть проблема. компонент: import { Observable } from 'rxjs/Observable'; import 'rxjs/add/observable/interval'; import 'rxjs/add/operator/switchMap'; private getUserTasks(userId): void { Observable .interval(5000) .switchMap(() => this.tasksService.getUserTasks(userId)) .subscribe( data => { this.userTasks = JSON.parse(data); console.log('userTasks', this.userTasks); } ) }; сервис: import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { Observable } from 'rxjs/Observable'; import 'rxjs/add/observable/interval'; @Injectable() export class TasksService { constructor(private http: HttpClient) { }; getUserTasks(userId): Observable<any> { return this.http.get('http://127.0.0.1:8000/app_tasks/user_tasks?user_id=' + userId); }; } Проблема в том, что первый запрос отправляется после того как пользователь подождёт 5 секунд, глядя в белый экран. А мне нужно чтобы первый запрос отправлялся сразу после загрузки страницы. Я мог бы повесть индикатор или спиннер, но дело в том, что, возможно, период придётся увеличить до 60 - 120 сек. Всё это время смотреть на индикатор неприятно пользователю

ребята, скажите пожалуйста что-нибудь про эту поделку. исходники здесь верстал только по браузеры мобильных устройств. бекенда нет поэтому для хранения информации используется localStorage. вот список паролей для входа: ADMINS: user2 / qwerty2 user4 / qwerty4 USERS: user1 / qwerty1 user3 / qwerty3 user5 / qwerty5 user6 / qwerty6 user7 / qwerty7 хотелось бы услышать что-нибудь по js, но вряд ли кто-нибудь будет копаться. поэтому пишите общее впечатление, юзабилити и т.п.

помогите пожалуйста советом и направьте в правильное русло так сказать на angular2 сделал небольшой сайт, который состоит из двух страничек: расписание и список людей. архитектурно он состоит из главного компонента и двух компонентов страничек сайт двуязычный. для этого я в главный компонент поместил стандартный material-переключатель и связал его с глобальным сервисом. в этом глобальном сервисе содержатся переменные, которые должны быть видны из любой части сайта. в частности там хранится признак установленного в настоящий момент языка переключатель в шаблоне главного компонента: <mat-slide-toggle class="toggler-lang" (click)="toggleLang()" [(ngModel)]="isEnLang"></mat-slide-toggle> сервис глобальных переменных: private isEnLang = new BehaviorSubject(false); constructor() { } getLangState(): Observable<boolean> { console.log('this.isEnLang', this.isEnLang); return this.isEnLang; }; setLangState(state): void { console.log('set isEnLang', state); this.isEnLang.next(state); }; функционал главного компонента для смены языка: private isEnLang: boolean; constructor(private globalVarsService: GlobalVarsService) {}; ngOnInit() { this.checkLang(); }; private toggleLang() { this.isEnLang = !this.isEnLang; this.globalVarsService.setLangState(this.isEnLang); }; private checkLang(): void { this.globalVarsService.getLangState().subscribe(data => setTimeout(() => { console.log('subscribe', data); this.isEnLang = data; }, 0)); }; проблема в том, что мне приходится в каждом компоненте, в котором используется переключения языка подключать этот "глобальный" сервис и настраивать подписку получения изменения "глобальной" переменной isEnLang. и что самое страшное - этот код дублируется в каждом компоненте. сейчас сайт состоит из двух страничек и такое дублирование кода не страшно, но по мере роста сайта будет очевидно, что решение хоть и рабочее, но неверное подскажите пожалуйста более практичное решение даже если остальные решения более неудобные, то всё равно расскажите про них. всегда лучше знать несколько вариантов решения проблемы GITHUB

ребята, помогите пожалуйста исправить кривыми руками установленный компонент из angular 2 material я пытался запустить компонент диалога в самой простой форме. вот что у меня получилось. проблема в том, что после клика по кнопке диалог открывается шде тосбоку экрана, почти за его пределами. кроме того консоль выводит следующее сообщение об ошибке: app.module.ts: import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { MdButtonModule, MdDialogModule } from '@angular/material'; import { AppComponent } from './app.component'; import { ConvDialogComponent } from './conv-dialog/conv-dialog.component'; @NgModule({ declarations: [ AppComponent, ConvDialogComponent ], imports: [ MdDialogModule, BrowserAnimationsModule, MdButtonModule, BrowserModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { } app.component.ts: import { Component } from '@angular/core'; import { MdDialog } from '@angular/material'; import { ConvDialogComponent } from './conv-dialog/conv-dialog.component'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { selectedOption: string; constructor(public dialog: MdDialog) {}; private openMoneyConverter(): void { console.log(111); this.dialog.open(ConvDialogComponent); }; } conv-dialog.component.ts: import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-conv-dialog', templateUrl: './conv-dialog.component.html', styleUrls: ['./conv-dialog.component.css'] }) export class ConvDialogComponent implements OnInit { constructor() { } ngOnInit() { } }

Помогите пожалуйста установить дефолтное значение в datepicker ng material 2 в моём случае сам датапикер связан с моделью так: <md-input-container> <input mdInput [mdDatepicker]="picker" placeholder="Choose a date" [(ngModel)]="modelDateBegin"> <button mdSuffix [mdDatepickerToggle]="picker"></button> </md-input-container> <md-datepicker #picker></md-datepicker> В компоненте устанавливается значение модели так: export class DatepickerOverviewExample { private modelDateBegin = '02.07.2017'; } В результате браузер показывает датепикер, в котором предустановлено значение: "07.02.2017". Это явно не то что было установлено в компоненте Живой пример здесь: PLUNKER PS: При этом если на этой же странице использовать второй датепикер, то описанным выше способом значение в нём вообще не устанавливается

помогите пожалуйста получить ответ от ajax-запроса в angular2 вот код сервиса: import { Injectable } from '@angular/core'; import { Http } from '@angular/http'; import { Observable } from 'rxjs/Observable'; @Injectable() export class RecordsService { constructor(private http: Http){ } getRecords(dateBeginUnix, dateEndUnix): Observable<any> { console.log(dateBeginUnix, dateEndUnix); let result = this.http.get('http://127.0.0.1:8000/days/' + dateBeginUnix + '/' + dateEndUnix); console.log('result', result); return result; } } вот код компонента(сокращённый): export class PanelComponent implements OnInit { constructor(private recordsService: RecordsService) { } private modelDateBegin: Object; private modelDateEnd: Object; private records: Object; private data: Object; displayStatistic() { this.recordsService .getRecords(this.modelDateBegin['epoc'], this.modelDateBegin['epoc']) .subscribe(data => this.records = data.json()); } } в сервис передаются 2 переменные: this.modelDateBegin['epoc'], this.modelDateBegin['epoc'] в них содержатся временные метки в юникс-формате. на основе этих меток бекенд выдаёт результат в виде json. проблема только в том, что в функции subscribe не происходит получение и присваивание полученного результата. соответственно я не могу результат отправить в шаблон для вывода при этом в консоли нет сообщений об ошибках. а выводится следующее: result Observable {_isScalar: false} ps: если в компоненте я заменяю строку: .subscribe(data => this.records = data.json()); на такую: .subscribe(data => this.records = data); , то в this.records следующее: содержится следующее: Response with status: 200 OK for URL: http://127.0.0.1:8000/days/1498856400/1498856400