Frontender Libs - обзор библиотек JS / CSS

Получение зависимостей из активного маршрута

Свойство injector у RouterOutlet позволяет напрямую получить зависимости, предоставленные активным маршрутом. Это полезно при работе с динамическими компонентами, вложенными маршрутами и Standalone-архитектурой, где требуется доступ к провайдерам из маршрута без дополнительных обёрток.

import { Component, ViewChild } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { MyService } from './my.service';

@Component({
  selector: 'app-shell',
  template: `<router-outlet #outlet="outlet"></router-outlet>`,
})
export class ShellComponent {
  @ViewChild('outlet', { static: true }) outlet!: RouterOutlet;

  ngAfterViewInit() {
    const myService = this.outlet.injector.get(MyService);
    myService.log();
  }
}

Если MyService предоставлен только в маршруте, то доступ к нему возможен только через RouterOutlet.injector. Это исключает необходимость передачи данных через @Input или общие сервисы.

👉 @sWebDev

👍4

www.tgoop.com/sWebDev/3788

910 viewsJun 16 at 08:11

Получение зависимостей из активного маршрута

Свойство injector у RouterOutlet позволяет напрямую получить зависимости, предоставленные активным маршрутом. Это полезно при работе с динамическими компонентами, вложенными маршрутами и Standalone-архитектурой, где требуется доступ к провайдерам из маршрута без дополнительных обёрток.

import { Component, ViewChild } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { MyService } from './my.service';

@Component({
  selector: 'app-shell',
  template: `<router-outlet #outlet="outlet"></router-outlet>`,
})
export class ShellComponent {
  @ViewChild('outlet', { static: true }) outlet!: RouterOutlet;

  ngAfterViewInit() {
    const myService = this.outlet.injector.get(MyService);
    myService.log();
  }
}

BY Frontender Libs - обзор библиотек JS / CSS