각지지 않은 페이지 내에 각지지 않은 2가지 구성요소 분사

각지지 않은 페이지 내에 각지지 않은 2가지 구성요소 분사

현재 Angular 1 -> Angular 2의 업그레이드 경로와 Angular 1 작업에서 수행한 한 가지 작업은 앱이 아닌 공용 페이지에서 일부 구성 요소를 재사용하는 것입니다.

이러한 페이지는 효과적으로 정적 HTML이며(레일에 의해 렌더링되지만), 일부 Angular 2 구성요소는 페이지 내에 제자리에 떨어집니다.이 작업은 Angular 1에서 시작하여 필요한 지시사항과 구성요소를 제공하는 모듈로 문서 요소를 부트스트랩했습니다.라우팅이 전혀 없습니다.

Angular 2를 사용하면 전부 또는 전혀 아닌 것처럼 보입니다.단일 루트 구성 요소를 선언하면 모든 것이 이를 통해 렌더링됩니다.이것은 우리에게 큰 변화가 될 것이며, 저는 이러한 공개적인 페이지에서 일하는 방식을 바꾸고 싶지 않습니다.

정적 HTML 페이지에서 필요에 따라 Angular 2 구성 요소를 사용하는 것이 가능합니까, 아니면 단일 루트 요소 SPA 설계로 전환해야 합니까?

간단히 말해서, 제가 묻고 싶은 것은 동적 각도 구성 요소가 내부에 뿌려진 정적 내용을 혼합할 수 있는지, 아니면 모든 각도 구성 요소가 페이지의 하나의 루트 요소 내에 있어야 하는지입니다.

그래서 제가 처음에 생각했던 것보다 간단합니다.Angular 2 문서에는 여러 앱의 부트스트래핑에 관한 몇 가지 특정한 문구가 있습니다.

여러 응용프로그램 부트스트래핑

브라우저 창 내에서 작업할 때 쿠키, 제목, 위치 등 여러 가지 단일 리소스가 있습니다.이러한 리소스를 나타내는 Angular 서비스도 동일한 브라우저 창을 점유하는 모든 Angular 애플리케이션에서 공유되어야 합니다.이러한 이유로 Angular는 모든 공유 서비스를 저장하는 하나의 글로벌 플랫폼 개체를 생성하고, 각 Angular 애플리케이션 인젝터는 플랫폼 인젝터를 부모로 합니다.

각 응용 프로그램에는 자체 전용 인젝터도 있습니다.한 페이지에 여러 개의 응용 프로그램이 있는 경우 Angular는 각 응용 프로그램 인젝터의 서비스를 해당 응용 프로그램의 개인 서비스로 취급합니다.

따라서 이것이 가능하도록 의도된 것임이 분명하고 여러 앱이 서비스 리소스를 공유하는 것이 제가 희망하는 바입니다.

여러 개의 부트스트랩된 구성 요소로 몇 가지 사소한 테스트를 해보았는데 잘 작동합니다.아직 시도하지 않은 한 가지는 Angular 2 구성 요소 이외에서 사용하기 위한 Angular 2 속성 지시문을 부트스트래핑하는 것입니다.저는 그것이 작동하지 않을 것이고 부트스트랩은 지시사항이 아닌 구성요소에서만 작동한다고 생각합니다.

지침의 관점에서, 저는 Angular 2가 정적 페이지 전체에 살수 동작을 위해 실제로 설계된 것이 아니며 아마도 그런 방식으로 사용되어서는 안 된다고 제안하고 싶습니다.오히려, 페이지의 여러 섹션이 여러 앱에 의해 정의될 수 있지만, 해당 구성요소는 문서/인터페이스의 거의 모든 부분을 구성해야 합니다.

우리는 필요한 지시사항과 구성요소를 제공하는 모듈로 문서 요소를 간단히 부트스트랩했습니다.라우팅이 전혀 없습니다.

제가 지금 Angular2를 사용하고 있는 방법입니다.https://github.com/niczero/ng2-es5-file-upload/blob/master/demo/index.html 의 예를 참조하십시오. 내 '정적' 페이지 중 일부는 당신이 루비를 사용하는 것과 같은 방식으로 펄에 의해 생성됩니다.

또한 범용 모듈 정의를 사용하면 모듈을 양방향으로 사용할 수 있는 것이 훨씬 쉬워집니다.

언급URL : https://stackoverflow.com/questions/35418243/sprinkling-angular-2-components-inside-a-non-angular-page