Angular2 — присваивание в конструкторе в TypeScript как это работает? Доброго времени суток.
Может ли кто то объяснить как правильно записать эти строки не передавая их в параметры конструктора?import { Router } from '@angular/router';
import { Injectable } from '@angular/core';
@Injectable()
export class ApiService {
constructor(private router: Router) { }
get(){
this.router.navigate(['/test']);
}
}
Пробовал переписать конструктор вот так, что бы не передавать Http в классе использующем этот сервис.
Получаю ошибку и не могу понять как это нужно записать правильно:private router: Http;
constructor() {
this.router = new Router();
}Как нужно переписать конструктор и как передавать параметр в него при таком же раскладе?
Для примера где можно показать, как нужно делать правильно даю вот этот исходник.
В нем интересно только два файла:app/route.click.ts - в нем есть метод go() по которому переходим на первую страницуapp/layout/layout.component.ts - он наследуется от вышеприведенного класса, и в нем нужно вызвать родительский метод go(). Как заинжектить зависимости из app/route.click.ts без заноса их в параметры конструктора?
Заранее спасибо.upd:
Поменял в этом примере Http на Router что бы пример был более детальным

21 Авг 2019 в 07:02
256 +1
0
Ответы
1

Для правильной записи и переписи конструктора в данном случае, вам нужно использовать Dependency Injection в Angular.

В вашем первоначальном коде, вы используете Dependency Injection для внедрения зависимости Router прямо в конструктор сервиса ApiService. Это позволяет Angular управлять созданием и предоставлением экземпляра Router.

Чтобы использовать Dependency Injection в другом классе (например, в app/layout/layout.component.ts), вам нужно добавить ApiService к провайдерам в модуле Angular, который загружает эти компоненты.

Примерно так это может выглядеть:

app.module.ts:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { Router } from '@angular/router';
import { ApiService } from './api.service';
import { LayoutComponent } from './layout/layout.component';
@NgModule({
imports: [BrowserModule],
declarations: [LayoutComponent],
providers: [ApiService, Router],
bootstrap: [LayoutComponent]
})
export class AppModule { }

layout.component.ts:

import { Component } from '@angular/core';
import { ApiService } from '../api.service';
@Component({
selector: 'app-layout',
template: '<h1>Layout Component</h1>'
})
export class LayoutComponent {
constructor(private apiService: ApiService) {
this.apiService.get();
}
}

В этом примере ApiService и Router добавлены в провайдеры модуля AppModule. Теперь класс LayoutComponent может использовать ApiService через Dependency Injection.

Надеюсь, это поможет вам понять, как работает Dependency Injection в Angular и как правильно передавать зависимости без явного указания их в конструкторе каждого класса.

20 Апр 2024 в 13:09
Не можешь разобраться в этой теме?
Обратись за помощью к экспертам
Гарантированные бесплатные доработки в течение 1 года
Быстрое выполнение от 2 часов
Проверка работы на плагиат
Поможем написать учебную работу
Прямой эфир