백엔드 렌더링 매개변수를 Angular 2 부트스트랩 방법에 어떻게 전달할 수 있나요?

백엔드에서 렌더링된 매개변수를 Angular2 부트스트랩 메서드로 전달하는 방법

Angular2에서 부트스트랩 메서드는 애플리케이션을 시작하고 선택적 공급자 배열과 함께 구성 요소를 허용합니다. 이 기사에서는 백엔드에서 얻은 매개변수를 부트스트랩 방법으로 전달하는 방법을 살펴봅니다.

Angular의 종속성 주입 사용

간단한 솔루션은 Angular의 종속성 주입을 사용하는 것입니다.

import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from "./app.component.ts";

// Retrieve headers from the server
var headers = ...;

// Pass headers to bootstrap method using dependency injection
bootstrap(AppComponent, [{provide: 'headers', useValue: headers}]);

헤더가 필요한 구성 요소나 서비스 내에서 @Inject를 사용하여 헤더를 삽입할 수 있습니다. 데코레이터:

class SomeComponentOrService {
   constructor(@Inject('headers') private headers) {}
}

사용자 정의 RequestOptions 공급자 사용

또는 사용자 정의 BaseRequestOptions 공급자를 생성할 수 있습니다.

class MyRequestOptions extends BaseRequestOptions {
  constructor (private headers) {
    super();
  }
} 

// Retrieve header values from the server
var values = ...;
var headers = new MyRequestOptions(values);

// Pass the custom request options to the bootstrap method
bootstrap(AppComponent, [{provide: BaseRequestOptions, useValue: headers}]);

이 방법을 사용하면 수정된 요청 옵션을 직접 제공할 수 있습니다. 요청에 대한 추가 제어가 필요한 경우 유용할 수 있는 부트스트랩 방법에 대한 요청 옵션

APP_INITIALIZER 활용

최신 버전의 Angular(RC.5 이상)에서는 APP_INITIALIZER 토큰을 사용하여 컨텍스트를 초기화하고 컨텍스트가 해결될 때까지 기다리는 함수를 실행할 수 있습니다. 앱 부트스트랩.

function loadContext(context: ContextService) {
  return () => context.load();
}

@NgModule({
  ...
  providers: [ ..., ContextService, { provide: APP_INITIALIZER, useFactory: loadContext, deps: [ContextService], multi: true } ],
})

이 접근 방식은 컨텍스트를 초기화하고 필요한 데이터를 사용할 수 있을 때까지 애플리케이션을 시작할 수 있습니다.

결론

이러한 기술을 활용하면 백엔드에서 렌더링된 매개변수를 Angular2 부트스트랩 방법으로 전달할 수 있으며, 이를 통해 이러한 매개변수를 구성 요소에 삽입하고 애플리케이션 초기화 단계에서 서비스를 제공합니다.

위 내용은 백엔드 렌더링 매개변수를 Angular 2 부트스트랩 방법에 어떻게 전달할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!