Мне нужно запросить некоторые данные с сервера только один раз, а затем использовать их, пока приложение загружено
getData(callback: Function) {
if (this.data) {
callback(this.data);
} else {
this.query.http.get('url', res => {
this.data = res;
callback(this.data);
});
}
}
проблема в том, что когда приложение запускается, многие компоненты запрашивают данные сразу, что приводит к 30-40 http-запросам, поэтому я придумал следующее решение:
getData(callback: Function) {
if (this.data) {
callback(this.data);
} else if (!this.gettingData) {
this.gettingData = true;
this.query.http.get('url', res => {
this.data = res;
callback(this.data);
});
} else {
setTimeout(() => {
getData(callback);
}, 500)
}
}
поэтому он снова запрашивает данные через 500 мс, если HTTP-запрос выполняется, если запрос возвращает ошибку, я сбрасываю getdata на false, он работает, но кажется грязным и неправильным, как я могу подписаться на текущий HTTP-запрос, вызываемый другой вызывающий функцию?
как насчет этого?
getData () {
this.query.http.get('url'). subscribe(
res=> this.data = res,
err=> console.info(err));
}
затем просто используйте this.data во всем своем компоненте, вы можете выдать данные, если они из дочернего компонента, например
@Output() valueChange = new EventEmitter();
private data;
getData () {
this.query.http.get('url'). subscribe(
res=> {
this.data = res;
this.valueChange.emit(this.data);
},
err=> console.info(err));
}
надеюсь, это поможет. или несколько отвечает на ваш вопрос
спасибо, полученные данные используются в службе, это будет означать, что я должен подписаться на этот эмиттер событий в каждом отдельном компоненте, отказаться от подписки при уничтожении, я рассматривал этот вариант, но это добавило бы много беспорядка в код
представьте службу, которая управляет вашими HTTP-запросами. Сервис - это, по сути, синглтон, который можно использовать с помощью внедрения зависимостей. Создайте это с
ng -generate service myservice
и введите его, объявив поле типа myservice
в качестве аргумента конструктора вашего компонента.