ot 모드에서 동적 바인딩을 수행하는 기능을 보고 싶습니다. 특히 이것이 로드맵에 추가되어야 하는 이유를 뒷받침하는 두 가지 사용 사례가 있습니다.

첫 번째는 모든 언어에 대해 별도의 애플리케이션을 원하지 않는 기본 사용 사례입니다. 이를 위해서는 앱 외부에서 일종의 리디렉션 로직이 필요하며 사이트를 완전히 다시 로드하지 않고는 언어를 동적으로 변경할 수 없습니다.

두 번째는 코르도바를 사용하여 모바일에 앱을 임베딩하는 경우입니다. 내가 아는 한 당신의 선택은 지트(jit)로 사이트 속도를 늦추거나, 모든 언어에 대해 별도의 앱을 만들거나, 앱에 모든 언어를 포함하는 것입니다. 이들 중 어느 것도 좋은 옵션이 아닙니다. Ionic은 i18n을 사용하지 않는 것 같은데, 그 이유가 무엇인지 궁금합니다.

@jlutz777 이는 2가지 유효한 사용 사례입니다. 이 주제는 최근 내부적으로 논의되었으며 저도 이에 대해 옹호해 왔습니다. i18n과 AoT가 Angular에서 작동하는 방식을 고려할 때 아직까지는 쉽게 가능하지 않지만 v5에서 AoT에 대한 새로운 컴파일 프로세스를 얻으면 미래에 가능할 수도 있습니다.
공식적이고 구체적인 내용이 있으면 로드맵에 한 번 추가하겠습니다.

저는 Electron + Angular 2 앱에서 작업 중이며 이제 Angular와 함께 i18n 기능을 사용하여 여러 언어에 대한 현지화 지원을 추가하려고 합니다. 실제로 템플릿 문자열을 추출하고 다른 언어 파일 형식으로 변환하는 것은 명확하게 문서화되어 있지만 여전히 명확하지 않고 다음을 찾고 있습니다.

• 언어를 동적으로 전환할 수 있습니까? 또는 다른 언어에 대해 별도로 응용 프로그램을 빌드해야 합니까?
• 모든 문자열을 한 곳에서(키/값 쌍의 형태로) 관리/통합하여 변경할 수 있습니까?
  한 장소의 문자열이 여러 장소에 영향을 미치나요?
• 특정 언어 문자열을 가져오기 위해 템플릿이 아닌 다른 곳에서 현지화된 파일에 액세스할 수 있습니까?
  제공된 키? (위에서 질문한 것과 동일).

포인트 2와 3은 "템플릿 외부의 번역 문자열 사용 - #11405" 기능으로 해결됩니다.
요점 1에 대해서는 위의 @jlutz777 에 대한 답변을 참조하십시오. 현재로서는 여전히 여러 언어로 앱을 빌드하거나 부트스트랩에서 번역을 동적으로 로드할 수 있는 JIT를 사용해야 합니다(런타임에 전환되지는 않지만 x번 번들로 묶는 것보다 여전히 낫습니다).

애플리케이션에서 사용되는 UI 언어는 동일한 애플리케이션의 여러 버전을 빌드할 필요가 없는 것이어야 합니다. 이것은 어떤 식으로든 "컴파일러" 문제가 되어서는 안 됩니다. 그렇다면 컴파일러에 결함이 있는 것입니다. 문제는 런타임에 데이터 파일에서 텍스트를 로드할 수 있도록 응용 프로그램을 설계하는 것이어야 합니다. 이는 다른 모듈처럼 로드하고 사용할 수 있는 모듈/라이브러리로 수행해야 합니다. 컴파일러 기능을 전혀 만들지 마십시오.

@figuerres 그것은 미래에 변경될 것입니다. 아직 약속은 없지만 우리는 이 문제를 알고 있고 가능한 해결책을 찾고 있습니다. 외부 파일을 사용하는 것이 그 중 하나입니다.

안녕하세요 @ocombe - 우리 애플리케이션에 Angular에서 i18n을 사용할 것 같습니다. 문서에 더 이상 사용되지 않거나 향후 몇 개월 동안 주요 변경 사항이 있을 것으로 생각되는 기능이 있습니까? 어떤 정보라도 대단히 감사하겠습니다. 그리고 DVD에 다시 한 번 감사드립니다!

안녕하세요 @rjsteinert! 알게 되서 다행이야!
현재 계획된 주요 변경 사항은 ID 자동 생성뿐입니다. 방법이 변경되고 ID가 더 이상 일치하지 않지만 번역 파일을 업데이트하는 cli 마이그레이션 도구(및 준비가 되었을 때만 마이그레이션하는 데 사용할 수 있는 매개변수)가 있습니다.

오늘 이 주제에 대해 많이 검색했는데 i18n-tag를 번역 대신 서비스 호출로 바꾸는 것과 같은 "간단한" 솔루션이 있는지 궁금합니다.

현재의:
<span i18n>Hello world</span> => <span>Hello world</span> 로 렌더링됨

내 생각:
<span i18n>Hello world</span> => <span>{{i18nservice.translate('pass-in-the-generated-message-id')}}</span> 로 렌더링됨

이런 식으로 API, 파일 등에서 서비스를 채울 수 있고 새 소스를 로드할 때 로케일을 전환하는 경우에도 i18nservice.setLocale('de-DE') 이상이 되지 않기 때문에 실제 번역은 AOT에서 동적으로 수행될 수 있습니다.
xi18n-tool을 사용한 텍스트 추출은 여전히 ​​이전과 같이 작동하며 생성된 메시지 ID를 활용하여 번역 서비스의 인덱스로 사용할 수 있습니다.
현재 구현은 ngc가 "--use-i18nservice" 플래그를 찾고 그렇지 않으면 지금까지 컴파일할 수 있기 때문에 여전히 완벽하게 작동합니다.

내가 현재 식별할 수 있는 한 가지 문제는 i18nservice를 각각의 모든 구성 요소에 주입하는 것인데, 이는 호출 가능하기 위해 구성 요소 컨텍스트에 존재해야 하지만 어떤 방식으로든 해결할 수 있어야 하기 때문입니다.

이에 대한 생각이 있습니까?

그것은 우리가 고려하고 있는 것 중 하나입니다. 컴파일러를 런타임(AOT)에 사용할 수 없을 때 해당 번역 내부의 코드 블록을 처리하는 방법에 대한 문제가 여전히 있습니다. 그것은 우리가 번역 내부에서 각도 구성 요소/지시문/파이프를 사용할 수 없다는 것을 의미합니다...

예, 그 생각을 하지 않았습니다.
저는 현재 빌드 단계(webpack)에서 HTML로의 모든 번역을 인라인하고 ng-switch를 사용하여 ng-컨테이너로 래핑하는 POC/해결 방법을 개발 중입니다.
i18n 속성의 경우 nativeElement에서 설정하는 지시문을 사용하고 있습니다.
번역 자체도 "렌더링"되어 모든 <x id=".. "/> 자리 표시자를 대체합니다.

추악하지만 작동합니다 ... ng가 기본적으로 지원하기를 기다릴 수 없습니다.
이번 주 후반에 POC를 게시할 예정이며, 향후 구상에 도움이 될 수 있습니다.

구현이 있을 때까지 내 요구에 맞는 "솔루션"을 생각해 냈습니다.
프리로더는 이제 컴파일러에 넘기기 전에 모든 로케일에 대해 HTML을 렌더링하며 지금까지는 매력처럼 작동합니다.

레포: https://github.com/actra-development-oss/ng-i18n-aot-loader
NPM: https://www.npmjs.com/package/@actra-development-oss/ng -i18n-aot-loader

구성 요소에는 서비스가 필요함을 시스템/컴파일러에 알리는 속성이 있을 수 있습니다.
그런 다음 해당 서비스는 id와 로케일을 가져와 현지화된 텍스트/마크업을 반환합니다.
모든 지역화된 텍스트는 서비스가 읽을 수 있는 리소스로 서버에 저장됩니다.

구성 요소에 속성이 없는 경우 로캘 런타임이 없습니다.
구성 요소에 있는 경우 런타임에 현지화된 데이터 가져오기를 호출합니다.
컴파일러는 데이터 파일을 빌드하고 서비스를 연결합니다.

이것은 대부분의 응용 프로그램에 대한 가장 일반적인 요구 사항을 처리하고 사이트에서 동일한 앱의 여러 복사본을 빌드하고 유지 관리할 필요가 없는 좋은 방법인 것 같습니다.

나도 그런 생각을 했다.
문제는 번역이 바인딩을 포함할 수 있으므로 외부 리소스에서 번역 파일을 로드할 때 코드 주입을 위해 시스템을 열 수 있다는 것입니다.
또한 번역에 따라 이러한 바인딩을 동적으로 해결하려면 컴파일러가 필요합니다.

IMHO 유효한 솔루션은 컴파일 타임에 인라인 번역에 POC(위 주석 참조)로 구현한 방식일 수 있습니다.
위에서 언급한 두 가지 문제는 모두 제거될 것입니다. 내가 상상할 수 있는 유일한 단점은 아마도 번들 크기이며 "일반 번들" + (번역된 html-size * 로케일)로 커질 것입니다.
전체 문서 대신 i18n -tagged html을 사용하여 ng-switch 만 낮출 수 있지만 여전히 i18n-* -tags에 문제가 있습니다.

글쎄, 여기에 문제가있다; 때때로 당신은 한계가 있습니다 ....

실용적인 관점에서 보면 그런 것이 없는 것이 더 나을 수 있습니다. 여러 언어로 제공될 수 있는 텍스트 덩어리를 가질 수 있습니다. 이야기의 끝.

데이터 바운드 청크가 필요합니까? 좋아, 하지만 그것은 국제화된 텍스트 안에 있지 않으므로 분리되어야 합니다. 여전히 html과 css를 사용하여 결과의 ​​스타일을 지정하고 형식을 지정할 수 있습니다. 그러나 생각할 수 있는 모든 방식으로 이들을 포함하거나 결합할 수는 없습니다.
예를 들어 div 또는 ap 태그는 여러 범위를 가질 수 있습니다. 한 범위는 텍스트이고 다른 범위는 텍스트 범위가 i18n 로케일 서비스에 바인딩된 바인딩 날짜이고, 날짜는 두 범위가 있는 일부 날짜 서비스에 바인딩됩니다. 서식을 지정하는 단락 태그입니다.

간단하게 유지하고 모든 사용자의 95%가 먼저 작동하도록 한 다음 극단적인 경우를 파악하십시오.

나는 그것을 극단적인 경우로 보지 않고 평소와 같이 비즈니스입니다.
Angular는 비즈니스급 프레임워크이므로 i18n 사용자의 전부는 아닐지라도 텍스트 내부에 바인딩 또는 적어도 복수화 및 선택이 필요합니다.

<span i18n>Hello, {user.gender, select, m {Mr.}, f {Ms.}} {{user.name}}</span>
분리된 문자열로 어떻게 해결하시겠습니까?
간단한 대답: 대상 언어의 규칙을 알 수 없으므로 모든 언어가 '인사말', '성별', '이름' 형식을 따르는 것은 아닙니다.

이러한 청크를 분리하면 다음과 같습니다.

• 문맥을 죽이면 번역가가 완전한 문장의 의미를 이해하지 못할 것입니다.
• CSS로 청크를 올바른 순서로 병합하는 것은 불가능합니다. 각 번역에 대한 규칙을 지정해야 하므로 CSS 사용자는 대상 언어를 알아야 하고 번역 사용자는 CSS를 알아야 합니다. 둘 다 허용됩니다.

코어 i18n은 예상대로 각도로 작동하며 비즈니스급 앱에 사용할 수 있습니다. 분명히 누락된 것은 AOT 호환성뿐이므로 강력하고 작동하는 시스템을 절반도 되지 않는 것으로 교체해야 하는 이유를 이해할 수 없습니다. 작업을 완료하려면 여러 번 작업해야 합니다.

이 문제에 대한 해결책을 찾기 위해 내일 회의가 있습니다.

@ocom 이 소식을 듣게 되어 기쁩니다. 이것이 Angular의 향후 릴리스를 위한 좋은 자료로 이어지기를 바랍니다. 여기 직장에서 우리는 대부분의 개발 요구 사항이 어떻게 작동하는지 정말 좋아합니다!

@ocombe , 전체 문서를 다시 로드하지 않고 언어를 변경할 수 있습니까? 내가 설명한다 :
이름이 "about"인 페이지에 있지만 언어를 변경하면 응용 프로그램의 기본 항목 페이지로 리디렉션됩니다.

i18n-app에서 작업하는 동안 @angular/material(node_modules에 있음)의 외부 스타일시트를 해결할 수 없어 ng-xi18n -tool이 실패했다는 알려진 "버그"도 발견했습니다.
나는 POC로도 추출 도구에 대해 "누락된 파일 무시"-HostContext를 구현했지만 주 리포지토리에 연결되도록 PR #17845로 추가했습니다.

@ocombe 이 주제에 대해 매우 활발한 것 같으니 PR을 보고 피드백을 주시겠습니까?

감사합니다. 살펴보겠습니다.

동적 데이터를 포함하여 전체 프로젝트에 대해 내부화를 구현하는 방법을 며칠 동안 찾았지만 구체적인 것을 찾지 못했습니다. 당분간은 저에게 도움이 되는 다른 것을 제안해 주시겠습니까? 감사합니다.

안녕하세요 @ocombe입니다! @jlutz777 이 제기한 요점에 대해 후속 조치를 취할 수 있습니까(동적 바인딩에 대해, 따라서 언어당 하나의 앱이 없음)?

작업에 감사드립니다!

@vicb 는 지금 작업 중이며 5.x에 있을 것입니다(5.0이 아니라 5.1일 가능성이 높음)

@ocombe 체크리스트를 업데이트해야 합니까? 나는 그들 중 일부가 이미 최신 버전에서 병합된 것을 볼 수 있습니다. 그리고 그것은 당신의 노력을 더 잘 반영할 것입니다. 😃

예, 좋은 생각입니다. 업데이트하겠습니다.
편집: 업데이트됨

런타임 i18n(AOT가 있는 모든 로케일에 대한 하나의 번들) - [작업 중]

관련 문제/홍보/토론은 어디에 있습니까?

명명된 날짜 형식(예: ultraLongDate )을 확장하기 위한 API가 있으면 좋을 것이므로 기본 날짜 파이프가 이를 인식하고 사용자 지정 날짜 파이프가 필요하지 않습니다.

"Runtime i18n(AOT가 있는 모든 로케일을 위한 하나의 번들)"의 진행 상황이 궁금합니다.

우리 팀에는 60개 이상의 언어가 포함된 여러 개의 대형 앱이 있습니다. 지금 우리는 N이 언어의 개수가 되도록 N 빌드를 병렬로 실행합니다. 이것은 특히 앱이 상당히 크고 여러 환경에 하루에 여러 번 배포한다는 점을 고려할 때 상상할 수 있듯이 리소스 집약적입니다.

내가 바라는 것은:

1. 런타임 i18n의 대략적인 ETA
2. 런타임 i18n이 모든 언어에 대해 단일 빌드를 수행하는지 확인
3. 생성된 각 언어가 지연 로드 가능 여부 또는 단일 대규모 번들에 포함되는지 여부

ng가 "네이티브" 솔루션을 제공하기를 기다리는 동안 @chcaru 는 https://github.com/actra-development-oss/ng-i18n-aot-loader/ 를 살펴보십시오.
그것은 여러 로케일을 가진 하나의 AOT 빌드를 요구하는 것을 정확하게 제공합니다.

@chcaru :
1/ 대략적인 ETA는 Angular v6입니다(첫 번째 베타는 1월 말까지 해야 한다고 생각합니까? 확실하지 않음). 좋은 소식은 거의 모든 작업이 완료될 것이기 때문에 런타임 번역 후에 코드 번역이 빠르게 따라야 한다는 것입니다.
2/ 네
3/ 번역은 번들에서 분리되어야 합니다. 부트스트랩 전에 필요한 것을 지연 로드하거나 모든 것을 하나로 묶을 수 있습니다. 또한 모듈에 대한 지연 로드 번역을 지원하고 싶지만 언제 지원될지는 확실하지 않습니다. 는 가능하다

@ocombe angularv6이 출시될 때까지 번역을 동적으로 로드하거나 단일 패키지로 다국어 응용 프로그램을 만드는 가장 심각한 옵션은 ngx-translate입니다.

angularv6이 종료되었을 때 ngx-translate를 사용하여 쉽게 마이그레이션하는 데 도움이 되는 몇 가지 팁이 있습니까?
두 응용 프로그램 사이에 다리가 있습니까?

실제로는 코드가 상당히 다릅니다... 마이그레이션 도구 작업에 대한 의욕이 생기면 이러한 기능이 포함된 v6이 언제 나올지 알 수 있습니다.

안녕하세요, 향후 기능의 투명성에 감사드립니다.

다음 질문에 대한 답을 아는 것이 매우 도움이 될 것입니다.

1. 새로운 i18n 워크플로가 https://angular.io/guide/i18n 에 설명된 현재 워크플로와 얼마나 다를지 아십니까?

2. i18n 및 i18n-*(예: 선택적 사용자 지정 ID가 있는 i18n-title 속성)이 템플릿에서 계속 사용 가능합니까?

3. 다음 명령이 계속 작동합니까?

ng serve --aot --locale fr

ng xi18n  --i18nFormat=xlf
ng xi18n  --i18nFormat=xlf2
ng xi18n  --i18nFormat=xmb

1. 템플릿에서 추출한 messages.xlf 트랜스 단위가 코드에 사용된 것과 병합되는 방법은 무엇입니까?

1. 우리는 업데이트 경험을 가능한 한 매끄럽게 만들 것입니다. 아마도 이전에 작동했던 것이 적어도 v7까지는 계속 작동할 것입니다.
2. i18n 속성은 동일하게 유지됩니다.
3. 추출도 동일해야합니다
4. 그것은 아마도 변경될 유일한 부분일 것입니다. 아직 어떻게 변경될지 모르기 때문에 변경될 수 있는 사항을 말하지 않는 것을 선호합니다. 그러나 메시지는 보기가 생성될 때 런타임에 병합됩니다(따라서 부트스트랩과 표시되는 보기 사이 화면)

@Toub 의 의견에 따라 이 전환 기간 동안 구현하려는 다음 접근 방식(i18n 속성과 ngx-translate 혼합)에 대한 피드백을 받는 데 관심이 있습니다. 우리의 목표는 새로운 i18n 지원이 준비될 때 코드에서 수행할 업데이트를 최소화하는 것입니다.

(우리는 동적 로케일을 원합니다. 즉, 로케일당 하나의 생성된 앱이 아닌)

• 각도 추출 도구를 활용할 수 있도록 i18n 속성을 사용합니다.
• 추출된 도구를 기반으로 xliff 파일(또는 다른 형식)을 ngx-translate(json 또는 po)에서 사용할 수 있는 형식의 콘텐츠로 변환할 수 있습니다.
• 우리는 i18n 를 사용하여 요소에 translate 속성을 활용하여 번역을 적용합니다(이전에 추출).

다음은 샘플입니다.

<!-- Without parameters -->
<div i18n="hello-id" translate>HELLO</div>

<!-- With parameters -->
<div i18n="hello-id" translate [translateParams]="{value: 'world'}">HELLO</div>

피드백 주셔서 감사합니다!

ngx-translate에 대한 문제를 열 ​​수 있습니까? "번역"의 대안으로 "i18n" 속성을 지원하도록 라이브러리를 업데이트하는 것이 가장 좋은 방법일 것입니다.

@ocombe 제안 감사합니다! ngx-translate에서 이에 대한 문제를 추가했습니다...

@ocombe 내가 볼 수있는 문제는 i18n / i18n-* 속성이 런타임에 제거된다는 것입니다(https://github.com/angular/angular/issues/11042). 보관할 수 있는 방법이 있습니까?

나는 확인했고 내가 실수하지 않는 한 Angular i18n을 사용하는 경우에만 제거됩니다(즉, 컴파일을 수행할 때 번역을 로드한다는 의미).

@ocombe 이해하지만 Angular CLI를 사용하고 ng serve 로 애플리케이션을 시작했기 때문에 번역을 로드하지 않습니다 ...

@ocombe , 우리 회사는 현재 규정된 로케일별 다중 앱 전략을 사용하여 i18n을 지원하기 위한 노력을 곧 시작합니다. 또한 URL에 로케일을 포함하고 앱에서 기본 href를 설정할 계획입니다. 런타임 i18n 기능이 완료되면 url 로케일 전략을 변경해야 합니까? 런타임 i18n이 출시되면 대규모 리팩토링을 피하기 시작하는 더 좋은 방법이 있습니까? 이 모든 작업에 감사드립니다.

⬆️ "곧 시작됩니다"라고 말해야 합니다.

하나의 앱/로케일이 지금 그대로 작동해야 합니다(cli를 사용하지 않는 경우 부트스트랩에서 로케일 파일을 로드하기 위한 약간의 변경 제외)

번들 중에 템플릿에서 i18n 파일 속성이 제거된 저를 누군가 대상으로 지정해 주시겠습니까?

cc @ocombe

4.2.6에서 변경되었습니다(PR https://github.com/angular/angular/issues/17999).

안녕! 나는 오랫동안 이 스레드를 따라다녔다. v6의 첫 번째 베타가 나온 것을 보았습니다. 변경 로그를 읽었지만 이 오랜 문제와 관련된 내용을 보지 못했습니다. 이 전면에 어떤 소식이 있습니까? 아니면 적어도 인터페이스가 폴리필과 유사할 것이라는 보장이 있습니까?

작업해주셔서 감사합니다!

그것은 마지막 베타 중 하나 또는 아마도 RC(알고 있습니다...)에 있을 것입니다.
인터페이스는 코드 번역을 위해 Google이 내부적으로 사용하는 것이므로 종료 시 goog.getMsg 와 유사합니다. https://developer.pubref.org/static/apidoc/global/closure/goog/getMsg.html
하지만 래퍼를 사용 중일 수 있으므로 아직 확실하지 않은 Angular의 인터페이스가 변경될 수 있습니다.
내 폴리필에서 비슷한 인터페이스를 사용하지만 필요한 경우 id, 설명 및 의미를 정의할 수 있는 가능성이 있으며 우리는 어떤 식으로든 (매개변수를 통해 또는 데코레이터를 통해) 필요하다고 믿습니다.

모든 노력에 감사드립니다! 4월에 시작되는 전체 1.x 앱의 전면적인 재작성을 준비하고 있습니다. 이러한 변화에 대비하기 위해 우리가 할 수 있는/해야 하는 일이 있습니까? 지금 우리는 6.x를 사용할 계획입니다. 다시 한번 감사합니다!

@ocombe "앞뒤 공백 무시"가 언제 시작되는지 궁금하십니까?

로드맵을 업데이트해야 하지만 지금은 약간 혼란스럽습니다(저에게도). 특히 이 기능은 분명히 우선 순위가 아니므로 곧 작업할 것으로 기대하지 마십시오.

@ocombe 예, 좋을 것입니다. 우리도 런타임 i18n이 유일한 차단 지점인 런타임에 매우 관심이 있습니다. 완료 여부를 %로 추측할 수 있습니까?

노고에 진심으로 감사드립니다!

@오콤베

특히 이 기능은 분명히 우선 순위가 아니므로 곧 작업할 것으로 기대하지 마십시오.

여기서 말하는 기능을 명확히 해주실 수 있나요? 나는 어떤 가정도 하고 싶지 않습니다.

@ofuangka "선행 및 후행 공백 무시" 기능은 우선 순위가 아닙니다.
@Karamuto 지금은 추측하기 어렵습니다. 지금 작업 중입니다.

@오콤베
Runtime i18n에 대한 이정표를 공유해 주시겠습니까(AOT가 있는 모든 로케일을 위한 하나의 번들)

이제 우리는 xi18n 도구를 사용하거나 거대한 다국어 프로젝트에 타사 라이브러리를 사용하기로 결정했습니다.
우리는 표준 도구를 사용할 수 있기를 희망하지만 그것이 너무 원시적이라는 것을 알고 있습니다.

또한 xlf 파일을 분할할 수 있기를 원합니다(모듈당 하나의 파일). 가능합니까?

위로
런타임 i18n이 Angular 6에서 출시됩니까?

감사하고 행복한 코딩!

시간이 얼마 남지 않았으며 지금까지 이 기능에 대한 현실 인식이 없었기 때문에 이 작업이 제시간에 완료될 것이라는 희망을 잃습니다.

버전 7 릴리스는 우리에게 꽤 늦을 것입니다.

@카라무토 # 22654
v6에 나올 것 같은데 아이비를 먼저 끝내야 합니다.

이번 주에 hello world가 작동해야 하지만 최소한의 기능(예: ICU 지원 없음)으로 작동해야 합니다.
하지만 플래그 뒤에 아이비와 함께 출시되기 때문에 계속 작업하고 새로운 기능이 완료되는 대로 출시할 예정이므로 v7을 기다릴 필요가 없습니다.

@오콤베
그거 좋을 거 같아! 처음부터 ICU를 완료할 필요는 없습니다. v6의 후반부에서 발전한다면 이것은 우리에 의해 완전히 괜찮습니다.

다시 한 번 훌륭한 작업에 감사드립니다!

@Karamuto 는 #22654를 살짝 엿보세요!

멍청한 질문: 사용자 지정 구성 요소에 대한 문자열 기반 입력에 대해 i18n 지시문을 사용하는 방법이 있습니까? aria-labels를 전달할 때의 예:

멋진 작업을 수행하는 사용자 지정 버튼을 래핑합니다.

사용자 정의 버튼의 템플릿은 다음을 수행합니다.

이미이 작업을 수행하는 방법이 있습니까?

@kekraft 정적 입력을 사용하면 i18n 속성 구문을 사용할 수 있다고 생각합니다.

<custom-button ariaLabel="your label" i18n-ariaLabel></custom-button>

구성 요소에서:

<button [attr.aria-label]="ariaLabel">Some button</button>

@ocombe 런타임 i18n 작업을 완료하려면 기여자가 필요합니까?

응 ! v6 출시 ~~~
여기에 어떤 업데이트가 있습니까?

i18n angular 6의 예가 여기에 있습니다.
https://github.com/angular/angular/pull/23660

@sandangel 이 스레드의 시작 부분에 있는 계획에서 단순히 "모든 것" 또는 "확인된 모든 것"을 의미했습니까?
단일 애플리케이션을 갖는 것을 정말 고대하고 있었는데, 그것이 가장 중요한 것 중 하나라고 생각합니다. 링크한 #23660으로 이동하여 https://pr23660-e12f469.ngbuilds.io/guide/i18n 에 도달했습니다.
그러나 거기에는 여전히 다음과 같이 쓰여 있습니다.

AOT 컴파일러로 국제화할 때 각 언어에 대해 별도의 애플리케이션 패키지를 사전 빌드하고 서버 측 언어 감지 또는 URL 매개변수를 기반으로 적절한 패키지를 제공해야 합니다.

단일 애플리케이션을 여러 언어로 사용할 수 있습니까? 아니면 아직 사용할 수 없습니까?

@MrCroft 는 런타임 i18n이 아직 진행 중인 것 같습니다. 나는 당신처럼 몇 가지 더 많은 옵션을 읽었지만 모든 현지화에 대한 하나의 번들은 아닙니다 :(

우리는 작동 중인 hello world를 가지고 있지만 이것은 새로운 렌더러(ivy)만을 위한 것이며 ivy는 황금 시간을 위한 준비가 되지 않았기 때문에 불행하게도 기다려야 할 것입니다 :(

@ocombe 따라서 프로덕션에 Ivy가 없는 경우(아마도 v7 정도) 런타임 번역이 없을 것입니다. 이 올바른지?

@ocombe hello world와 ivy는 공개적으로 사용 가능합니까? 이 새로운 i18next 구현을 이해하려고 하면 멋질 것입니다😃

@fetis https://github.com/actra-development-oss/ng-i18n-aot-loader/

@fetis 네 :(
@feloy 네, 간단한 hello world는 여기에 있습니다: https://github.com/angular/angular/tree/master/packages/core/test/bundling/hello_world_i18n 하지만 매우 최소한입니다.
여기에서 테스트를 찾을 수 있습니다: https://github.com/angular/angular/blob/master/packages/compiler/test/render3/r3_view_compiler_i18n_spec.ts
여기에서 일부 리팩토링 + 추출: https://github.com/angular/angular/pull/22931

@ocombe 우리는 우리 응용 프로그램에서 i18n을 구현하려고 시도하고 있지만 어디에서나 읽을 때마다 언어당 하나의 messages.xlf 파일이 필요하다는 것을 알았습니다. 다양한 고객 대면 화면 등의 복잡한 응용 프로그램을 고려하여 유지 관리하는 데 오버헤드가 되지 않을까요? 구성 요소 또는 모듈별로 메시지 파일을 분석할 수 있는지 확인하려고 합니다. 이미 지원되나요?

@stickler-v 이 파일은 문자열을 번역 소프트웨어로 전송하기 위한 것입니다. 수동으로 번역하는 것을 고려하지 마십시오.

하지만 다른 언어로 된 실제 텍스트가 어디에 있습니까? 번역가가 하는 것과 대조적으로 이 텍스트를 수동으로 관리해야 합니다.

미안하지만 조금 길을 잃었습니다. https://angular.io/guide/i18n의 원본 문서를 기반으로 합니다. src/app/app.component.html에는 영어 텍스트만 있습니다. messages.fr.xlf는 프랑스어 텍스트가 있는 파일이지만 자동으로 생성되므로 건드리지 않는 것이 좋습니다.

영어 대신 프랑스어 텍스트를 사용하여 app.component.html을 렌더링하려면 프랑스어 메시지 "Bonjour" 등을 어디에 지정해야 합니까?

@stickler-v 정말 주제가 아니네요. StackOverflow에 질문을 만드세요. 그곳에서 기꺼이 답해 드리겠습니다.

여기에서 논의하지 않을 수 있습니까? 여기 주제가 아닙니다. 감사합니다.
@stickler-v 질문에 대해, 모듈/구성 요소당 하나의 파일은 지금은 불가능합니다. 미래에 가능할 수도 있지만 현재 작업 중인 목록에는 없습니다.

경로 번역을 지원할 계획이 있습니까?

이미 답변을 받았지만 이 버전에서 JS로 번역이 가능한가요? 아니면 여전히 템플릿 전용인가요?

@santhony7 아직 아이비가 준비가 안되어서 불가능합니다.

여기서 런타임 i18n의 의도/기능에 대한 한 가지 질문은 이것이 우리가 기본적으로 런타임에 언어를 선택하고 이전 ng-translate 의 기능처럼 앱을 다시 로드하지 않고 "뒤집기"할 수 있다는 것을 의미하는지입니다. AngularJS 및 ngx-translate ? 아니면 완전히 다른 것을 의미합니까?

아니요, 언어를 변경하려면 앱을 다시 로드해야 합니다.

현재 i18n에서는 번역을 빌드하고 제공할 때 번들 코드의 문자열을 교체합니다. 이는 번들이 현지화되었음을 의미합니다.
런타임 i18n은 번역 파일이 지금과 같이 빌드 시간이 아니라 앱이 시작될 때 로드된다는 의미입니다.
그 때문에 앱이 시작되기 전에 번역 파일을 지연 로드할 수 있습니다. 즉, 번들이 언어와 분리되어 앱에 대해 하나의 번들만 얻습니다.
또한 언어당 하나의 번들을 사용하도록 선택하고 언어 파일을 앱과 번들로 사용할 수 있습니다(지금 하고 있는 것처럼). 번역 파일을 지연 로드하는 데 필요한 지연을 피할 수 있습니다.
한 경우에는 추가 http 요청을 수행하고 다른 경우에는 수행하지 않지만 언어당 하나의 번들을 갖는 것을 정당화할 만큼 큰 차이는 없을 것이라고 생각합니다.

런타임 i18n의 장점:

• 언어 클라이언트 측을 감지하고 원하는 번역 파일을 지연 로드합니다.
• 코드가 언어 독립적이기 때문에 모든 언어에 대해 하나의 번들을 얻습니다.
• 라이브러리는 "i18n"과도 호환될 수 있습니다.
• 런타임에 번역을 로드하기 때문에 템플릿뿐만 아니라 코드에서도 번역을 수행할 수 있는 서비스를 제공하는 데 필요한 모든 것이 있습니다.
• 모듈당 번역을 분할할 수 있습니다(처음에는 사용할 수 없음).

단점:

• 런타임에 번역하는 것은 번역이 추출되어 html 노드로 변환될 때 약간의 비용이 듭니다.
• 앱 부트스트랩은 번역을 지연 로드하는 데 걸리는 시간만큼 지연되거나 번들이 약간 더 큽니다(번역을 번들로 묶는 경우)
• 번역을 읽을 수 있도록 앱 번들에 직렬 변환기를 추가해야 하며 이는 많은 코드입니다(이를 피하기 위해 일종의 json으로 번역을 "사전 컴파일"할 수 있지만 아직 결정하지 못했습니다. )

이론적으로 전체 앱을 다시 로드하지 않고 언어를 변경할 수 있지만 구성 요소가 생성될 때 템플릿이 생성되기 때문에 기존 구성 요소를 다시 만들어야 하거나 i18n 를 사용하는 대신 템플릿에 서비스를 바인딩할 수 있습니다.

또한 사람들이 생각해야 할 것은 한 언어에서 다른 언어로의 일부 변경은 작을 수 있고 다른 것은 클 수 있다는 것입니다. 예를 들어 영어에서 스페인어로 이동하는 것은 "작은" 일이지만 영어에서 중국어 또는 아랍어로 말하는 것은 클 수 있습니다.
일부 언어의 경우 텍스트뿐만 아니라 해당 언어를 수용하기 위해 다른 레이아웃을 디자인해야 할 수도 있으며 왼쪽에서 오른쪽 또는 오른쪽에서 왼쪽 및 기타 세부 사항에 대한 정렬 규칙입니다.

그래서 대부분의 실제 사용을 위해 앱이 앱에서 언어 감지 단계를 로드하여 올바른 리소스와 일부 레이아웃을 로드할 것으로 예상합니다.

@ocombe 설명 해주셔서 감사합니다! 현재 Angular i18n 를 애플리케이션 내에서 구현했으며 변경/알 수 없는 요구 사항으로 인해 걸림돌이 되었습니다. 또한 현재 격차를 해소하기 위해 https://github.com/ngx-translate/i18n-polyfill 라이브러리를 함께 사용하고 있습니다.

여러 번들이 약간의 성가심이지만 현재 충분히 쉽게 해결할 수 있습니다. 특히 걸림돌은 현재 사용되는 언어와 다른 언어로 표시되는 하나의 구성 요소(및 모든 하위 구성 요소)를 가질 가능성이 있습니다.

솔직히 ngx-translate 이 나를 위해 이 작업을 수행하는 데 도움이 될 수 있는지 아직 확실하지 않지만 피벗을 만들기 전에 가능한 많은 정보를 얻었는지 확인하기 위해 다가오는 변경 사항에 대해 메시지를 보내고 싶었습니다.

우리는 동시에 여러 언어로 번역된 앱을 지원할 계획이 없습니다. 번역/모듈을 로드할 수 있다면 미래에 가능할 수도 있지만 아키텍처의 부작용일 것입니다. 달성하기 위해 노력했습니다.

Ivy + 런타임 i18n에 대한 ETA가 있습니까?
그렇지 않은 경우 완벽하게 이해하지만 (현재 프로젝트의 기간을 감안할 때) 기다릴 수 있는지 또는 현재 솔루션 중 하나를 사용하기 시작하고 향후 버전을 위해 런타임 i18n으로의 마이그레이션을 연기해야 ​​하는지 알아야 합니다. .

나는 정확한 시간 프레임을 제공하려고 노력하지 않을 것입니다, 내가 시도할 때마다 그것은 틀렸습니다 :D
지금은 v7 이전 버전이 아닙니다(이전에 베타 버전으로 제공됨).

문제 없습니다. 우리 모두는 추정치가 항상 어떻게 틀리는지 알고 있습니다. :디
현재 i18n(+ i18n-polyfill)에서 런타임 18n으로 또는 ngx-translate에서 마이그레이션하는 것이 더 쉬울 것이라고 생각하십니까?

아마도 현재 i18n에서 가져온 것일 수 있지만 가능한 경우 Angular i18n의 내부를 사용하는 ngx-translate 버전을 작성할 것입니다(아직 확실하지 않음)

안녕하세요, 현재 상태를 이해하기 위해 이 스레드를 탐색하려고 했습니다. ngx 번역 코드는 현재 동적 지역화를 사용하는 단일 앱에 대해 가장 실행 가능한 "해결 방법"입니까?

안녕하세요, ngx-translate/i18n-polyfill을 사용하여 런타임에 현지화를 변경할 수 있습니까?

@suchg 런타임이 아닙니다. 런타임에 번역을 수행할 수 있지만 사용된 로케일을 변경할 수는 없습니다.

@mjschranz 빠른 답변 감사합니다
런타임 번역조차도 지금은 괜찮습니다. 같은 예를 공유할 수 있습니까?
https://github.com/ngx-translate/i18n-polyfill 에서 공유된 예제를 시도하고 크롬 브라우저의 언어를 변경했지만 운이 없었습니다.
특별한 번역 방법이 있나요??

외부 라이브러리가 아닌 Angular에 대한 토론을 여기에서 유지하십시오. 도움이 필요하면 github 저장소에 메시지를 게시하세요.

이 기능이 앞으로 어떻게 보일지에 대한 다른 추적 문제나 디자인 문서가 있습니까? 구현을 돕거나 v7의 전환이 가능한 한 원활하게 진행될 수 있도록 준비할 수 있습니다.

안녕하세요, 저는 현재 Angular 5를 실행 중이며 프로젝트에 다중 언어를 추가해야 합니다.
나는 지금 거의 우아하게 작동하는 솔루션을 추가했습니다. https://github.com/angular/angular/issues/24549.

이상적으로는 국가 스니퍼 서비스(호스트 이름 맵 조회 기반)를 기반으로 언어 파일을 지연 로드하고 싶습니다.
그것이 Angular 6에서 가능하다면 그것은 좋을 것입니다.

@mattiLeBlanc 구성 요소 또는 서비스의 메시지와 같은 동적 메시지를 어떻게 해결합니까?

@zverbeta Angular Core 또는 이 토론의 컨텍스트를 완전히 이해하지 못한 점에 대해 양해해 주십시오. 나는 초보자를 위해 내 컨텍스트에서만 접근 할 수 있습니다.

귀하의 질문에 대한 답변으로, 저는 우리가 URL 또는 언어 쿼리 매개변수에서 추론할 수 있는 로케일을 기반으로 멋진 방식으로 번역 파일(xlf)을 지연 로드하는 데만 관심이 있다고 가정합니다. (저는 현재 URL 맵을 사용하여 로케일이 무엇인지 결정합니다.)

구성 요소 또는 서비스의 메시지는 i18n으로 마크업에 태그를 지정하는 것처럼 태그가 지정되지 않습니다. 저는 Wordpress 및 PHP용 i18n에 대한 약간의 경험이 있습니다. 여기서 우리는 올바른 번역을 얻기 위해 __( 'text' to translate, 'text domain' ) 접근 방식을 사용합니다. 이 __() 는 메시지 파일을 생성하는 CLI 명령으로 스캔할 수도 있습니다.

이것은 당신이 언급하는 문제 중 하나입니까?

예를 들어 이 마크업 블록에서 내가 알아차린 한 가지는 (게으른 상태로 각 하위 요소에 i18n을 추가하고 싶지 않았기 때문에):

<div class="eligibility-banner" i18n="@@eligbilityBanner" fxLayout="column" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="center center" fxLayoutAlign="center start">
        <div class="requirement-text" fxFlex="20">To be eligible, you:</div>

        <div fxLayout="column" fxFlex="80" fxLayout.gt-xs="row" fxLayoutAlign="center start">
          <div fxLayout="row" fxLayoutAlign="center center" class="requirement" fxFlex="33">
              <pro-svg icon="icon-check-circle" className="icon-check" width="44" height="44"></pro-svg>
              <div class="text">own an Australian business (with a valid ABN/ACN)</div>
          </div>
          <div fxLayout="row" fxLayoutAlign="center center" class="requirement" fxFlex="33">
              <pro-svg icon="icon-check-circle" className="icon-check" width="44" height="44"></pro-svg>
              <div class="text">are over 18 years old</div>
          </div>
          <div fxLayout="row" fxLayoutAlign="center center" class="requirement" fxFlex="33">
              <pro-svg icon="icon-check-circle" className="icon-check" width="44" height="44"></pro-svg>
              <div class="text">are an Australian Citizen or Permanent Resident</div>
          </div>
        </div>
      </div>

그것은 전체 div 블록을 내 message.xlf에 복사합니다.
그것은 많은 마크업 오염입니다. (물론 텍스트를 포함하는 각 태그에 i18n을 사용할 수 있습니다.)

이 예에서 _e() 명령을 사용하면 꽤 잘 작동할 것입니다. echo 명령으로 텍스트를 래핑하면 래핑된 모든 텍스트가 수집됩니다. xml에서 모든 마크업 사본을 제거할 수 있습니다.
해당 문자열에 동적인 것을 추가해야 하는 경우 문자열에 자리 표시자를 사용하여 파이프할 수 있습니다( sprintf 에서 하는 것처럼).

<p>{{ __( 'I would like a nice %s, please', fruit ) }}</p> 

여기서 fruit 는 값이 __( 'apple') 또는 __( 'pear) 인 변수입니다.
3개의 텍스트가 XML로 되어 별도로 번역될 수 있습니다.

그게 무슨 소용이 있겠습니까? i18n 속성을 추가하는 것과 매우 유사합니다. 다시 읽고 나서 깨달았습니다. :)

마지막으로 몇 가지 형식을 살펴봅니다. XLIFF 2 는 1.2보다 약간 깨끗하고 꽤 멋지게 보입니다. XMB는 1995년에 스타일이 지정된 것처럼 보이는 혼란스럽고 끔찍한 문서처럼 보입니다.
XLIFF 2를 사용할 때 TARGET 텍스트가 버전 1.2에서와 같이 렌더링되지 않는다는 것을 알았습니다.

.pot 및 .mo 파일을 보셨습니까? 매우 간단한 형식이며 POEdit 도구로 번역된 경우에도 사용됩니다.

토글 버튼을 사용하여 내 애플리케이션을 영어와 스페인어로 변환해야 합니다. 모든 변경을 수행했고 파일을 별도로 작업했습니다. .dist/en 및 dist/es 아래에 두 개의 빌드를 만들었습니다. 배포를 위해 무엇을 해야 하고 두 빌드 간에 전환하는 방법을 알려줄 수 있습니까?

토글 버튼을 클릭할 때 해야 할 일

@shobhit12345 https://stackoverflow.com 에 지원 요청을 게시하세요.

@zverbeta #24549 에 게시한 솔루션은 --prod 로 빌드할 때 작동하지 않습니다. 아마도 사용할 수 없는 require 를 사용하고 있기 때문에 어떤 것이 분명합니까?
--prod 플래그가 없으면 웹팩 관련 코드가 포함되어 있기 때문에 솔루션이 작동합니까?

@mattiLeBlanc 이 lib https://github.com/ngx-translate/i18n-polyfill 을 찾았고 동적 텍스트 문제를 해결합니다.

안녕하세요, i 18 n 을 사용하여 동적 값(보간)을 어떻게 번역할 수 있습니까?

    <source>This amount is for <x id="INTERPOLATION" equiv-text="{{policyName}}"/> policy #<x id="INTERPOLATION_1" equiv-text="{{policyGroupId}}"/></source>
    <target>Esta cantidad es para <x id="INTERPOLATION" equiv-text="{{**policyName**}}"/> política #<x id="INTERPOLATION_1" equiv-text="{{policyGroupId}}"/></target>

이봐! 진행한 작업을 추적 및/또는 지원할 수 있는 곳이 있습니까? ( 작업 중인 태그 태그)

런타임 i18n 베타 버전 출시 일정에 대한 업데이트가 있습니까?

@marcelnem 주석을 찾을 수 없지만 iirc ocombe는 런타임 i18n이 ivy용으로 병합되어 ivy 플래그가 있는 v7 베타에서 테스트할 수 있다고 언급했습니다.

런타임 부분은 완료되었지만 컴파일러 부분은 완료되지 않았으므로 아직 ivy로 테스트할 수 없습니다.

안녕하세요, 저는 Angular 6 i18n으로 작업하고 있습니다. 나는 요리책을 따랐다는 것을 의미하는 다국어로 작업하고 있습니다.
https://v2.angular.io/docs/ts/latest/cookbook/i18n.html#!

현재 구현은 AOT를 사용하고 있으므로 messages.xlf 파일과 messages.pt.xlf를 생성했습니다. 내가 실행하면 모든 것이 잘 작동합니다.

ng 서브 --구성=pt

예상대로 텍스트가 번역됩니다. 하지만 작동 방식에 뭔가 매우 잘못된 부분이 있는 것 같습니다. 나는 아마도 뭔가를 놓치고있을 것입니다. 내가 이해하는 한, 번역할 새 문자열을 추가하고 이를 i18n 속성으로 표시할 때마다 "ng xi18n"을 실행하는 messages.xlf 파일을 다시 생성한 다음 messages.pt.xlf를 수동으로 업데이트해야 합니다. xlf 파일은 소스가 있는 줄 번호도 보유하고 있으므로 행을 변경하면 파일을 다시 생성하고 수동으로 pt 파일을 업데이트해야 합니다.

<context context-type="linenumber">16</context>

그것은 똑똑해 보이지 않습니다. 계속 작동하려면 많은 추가 작업이 필요합니다. 내 걱정을 이해합니까? 내가 뭔가를 놓치고 있습니까?
Angular 7 i18n에 Ivy가 통합되어 대규모 업데이트가 있을 예정인 것으로 알고 있습니다. 기다려야 하나요?

친애하는,
파비오

ps. 주제에서 벗어나지 않기를 진심으로 바랍니다만, 그렇다고 느끼신다면 최소한 방향을 제시해 주십시오. 예를 들어 이것을 어디에 물어야합니까? 또는 내 의심에 답할 수 있는 링크가 있는 경우.

@fabiopcarvalho 내가 깨달은 한 가지는 HTML 레이아웃의 변경 사항을 더 쉽게 추적할 수 있도록 모든 단일 번역에 대해 사용자 정의 ID를 사용하는 것이 현명하다는 것입니다.

하지만 예, 번역 파일을 정기적으로 업데이트해야 합니다.

@fabiopcarvalho 번역 병합을 돕기 위해 xliffmerge 를 사용합니다.

완벽합니다. 저는 그 도구를 사용했고 훌륭하게 작동했습니다. 나는 또한 id를 사용하고
그들은 도움이됩니다.
답장을 보내 주셔서 감사합니다 !!

2018년 8월 30일 목요일에 Pedro Romero [email protected] 은 다음과 같이 썼습니다.

@fabiopcarvalho https://github.com/fabiopcarvalho xliffmerge를 사용합니다.
병합을 도와줄 https://github.com/martinroob/ngx-i18nsupport
번역의

—
당신이 언급되었기 때문에 이것을 받는 것입니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/angular/angular/issues/16477#issuecomment-417407822 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AWOWQ6vpjOb0Ntgpv7TUngRrBBsUIkVjks5uWCV7gaJpZM4NOSBk
.

속성 aria-label이 접근성에서 많이 사용되기 때문에 속성에서 ICU 메시지를 허용하는 것은 접근성에 중요합니다. 후속 조치에 문제가 있습니까?

문제가 없는 것 같은데 열어주실 수 있나요? 지금 아이비용 ICU 표현 작업 중이라 TODO 추가했는데 기능요청이 더 나을듯

@ocombe , https://github.com/angular/angular/issues/21615

완전 감사합니다(Github 검색이 정말 좋지 않습니다!)!

새로운 버전의 i18n을 사용하여 HTTP를 통해 외부 소스에서 번역 파일을 지연 로드할 수 있습니까?

@ocombe 는 런타임 i18n(AOT가 있는 모든 로케일에 대한 하나의 번들)에서 작업하고 있다고 말했습니다. 우리가 기다린 지 1년이 넘었습니다. 언제 그 기능이 Angular 7 릴리스에 제공될 것이라고 기대할 수 있습니까?

@Sef1995 우리가 활성화하고 싶은 것 중 하나입니다.
@AhmadShahid 그것은 v7과 독립적으로 출시될 아이비를 필요로 할 것이고 아이비는 v7의 출시를 위해 준비되지 않을 것입니다. ivy의 일부는 플래그 뒤에 이미 v6에 있지만 완전한 기능이 아니며 실제 응용 프로그램에서 사용해서는 안됩니다. 아이비의 출시일은 아직 없습니다.

@ocombe 간단한 질문입니다. 다른 빌드(각 언어에 대해 하나씩)가 필요한 오늘(angular6) 현재 i18n을 구현하면 ivy가 나오고 i18n 런타임이 나올 때 노력이 손실됩니까? i18n이 지금 구현되는 방식은 앞으로 나올 것과 다를 것입니다. 몇 가지 스프린트를 미리 계획하고 작업의 우선 순위를 지정하려고 합니다. 감사 해요

피할 수만 있다면 주요 변경 사항을 만들고 싶지 않습니다. 추출된 번역의 id는 오랫동안 가지고 있던 버그를 수정함에 따라 변경될 수 있지만 마이그레이션 도구를 제공할 것입니다. 100% 호환될 것이라고 확신할 수는 없지만 원하는 경우 사용할 수 있는 새로운 옵션과 함께 대부분의 기능이 동일하게 작동할 것으로 기대합니다.

@ocombe 간단한 질문입니다. 다른 빌드(각 언어에 대해 하나씩)가 필요한 오늘(angular6) 현재 i18n을 구현하면 ivy가 나오고 i18n 런타임이 나올 때 노력이 손실됩니까? i18n이 지금 구현되는 방식은 앞으로 나올 것과 다를 것입니다. 몇 가지 스프린트를 미리 계획하고 작업의 우선 순위를 지정하려고 합니다. 감사 해요

안녕하세요, webpack require를 사용하여 하나의 빌드로 파일을 동적으로(임시 해결 방법으로) 로드할 수 있습니다.
예제는 여기에서 찾을 수 있습니다: https://github.com/angular/angular/issues/24549#issuecomment -402013622

AOT=true는 webpack 항목을 제거하므로 --prod --aot=false로 빌드해야 합니다.

@ocombe 안녕하세요,

A7 릴리스 후보가 나왔습니다. 약속대로 런타임 번역을 테스트할까요?. Runtime i18n (one bundle for all locales with AOT) . 이것을 어떻게 테스트 할 수 있습니까? 도와주세요

감사 해요

v7이 이미 출시되었지만 @sheikalthaf 의 질문에 두 번째로 질문합니다.

@sheikalthaf @Shuyinsama 위의 몇 가지 의견 과 첫 번째 메시지에서 설명했듯이:
런타임 i18n에는 v7과 별도로 릴리스될 ivy가 필요합니다. ivy의 일부는 플래그 뒤에 이미 v7에 있지만 완전한 기능이 아니며 실제 응용 프로그램에서 사용해서는 안됩니다. 아이비의 출시일은 아직 없습니다.

@ocombe : 부모에서 자식 구성 요소로 동적 i18n 키를 전달하는 것은 어떻습니까?

하위 구성요소:
<div i18n="{{labelTextKey}}">{{labelText}}</div>

상위 구성요소:
<app-input [labelText]="'Second name'" [labelTextKey]="'@<strong i="13">@LabelSecondName</strong>'" ..></app-input>

전달할 수 있지만 빌드 시 i18n 변환이 발생하기 때문에 변수는 여전히 비어 있는 상태입니다. 따라서 번역이 발생하지 않습니다.

그러한 경우에 대한 업데이트가 있습니까?

@밥카스비

하위 구성 요소에는 i18n 태그가 필요하지 않으며 다음과 같이 상위 구성 요소에서 사용할 수 있습니다.

<app-input i18n-labelText="@@LabelSecondName" labelText="Second name"></app-input>

@cjsase : 잘 작동합니다. 많은 감사합니다! 거의 2일동안 고생하셨습니다.

이를 기반으로 : https://github.com/angular/angular/issues/21706#issuecomment -430435254

• v7에서 ivy를 기대해서는 안 됩니다. v8은 2019년 3월/4월로 예정 되어 있습니다. v7에서 ivy를 기대하면 안 되는 경우 2019년 4월에 ivy가 출시될 때까지 국제화(i18n)에 무엇을 사용할지에 대한 권장/합의가 있습니까?

잘못된 정보입니다. 핵심 팀은 IVy가 2019년에 출시될 것이라고 말한 적이 없습니다. 대신 핵심 팀은 다음과 같이 말했습니다.

테스트 및 검증을 거친 모든 부 버전으로 출시되어야 합니다.

ivy가 활성화된 앵귤러 7.1.0-beta.0 앱이 있다고 가정해 보겠습니다. 페이지 새로 고침 없이 전면에서 발행된 동적 언어 변경 설정을 가질 수 있습니까?

그렇다면 어떻게? 이 문서: https://github.com/angular/angular/blob/master/aio/content/guide/i18n.md
그리고 이 문서: https://angular.io/guide/i18n

이거 안써?

현대/미래의 i18n 각도 앱을 만드는 방법은 어디에서 배울 수 있습니까?

@tatsujb 아니요, 불가능하며, ivy & runtime i18n으로도 불가능합니다. 지금은 언어를 변경하려면 Angular 앱을 다시 로드해야 합니다.

알았지 만 문서는 4 마이너스와 같은 각도의 키메라 버전에 적용됩니다.

나는 그들이 내 설정에 적용된다고 생각하지 않으며 변경 사항을 적용하는 방법을 정확하게 다루지 않습니다.

백엔드에서 변경 사항을 적용해야 한다고 생각합니다.

제 경우에는 내 각도가 Java-spring 백엔드에 의해 프로덕션 모드에서 제공됩니다. 언어를 변경하기 위해 깃발 아이콘을 누르면 어떤 일이 일어날까요?

사용자를 www.yourdomain.com/cn/ 으로 안내하면 전체 Angular 앱이 중국어로 컴파일됩니다. 지원하려는 모든 언어에 대해 컴파일된 전체 Angular 앱으로 끝납니다.

@ocombe @santhony7 이건 어때요: https://github.com/actra-development-oss/ng-i18n-aot-loader ?

내가 이것을 시도 할 수 있습니까?

7.1.0-beta.0과 호환이 잘 되지 않거나 호환이 잘 되나요?

@ocombe @santhony7 이건 어때요: https://github.com/actra-development-oss/ng-i18n-aot-loader ?

내가 이것을 시도 할 수 있습니까?

7.1.0-beta.0과 호환이 잘 되지 않거나 호환이 잘 되나요?

대신 ngx-translate를 사용하는 것이 좋습니다. 나는 둘 다 사용했고 ngx-translate는 유지 관리가 훨씬 쉽습니다.

@digismack 이 둘의 또 다른 차이점은 약간 무서운 ngx-translate가 모든 공식 angular-i18n 항목을 삭제하고 전혀 사용하지 않는다는 것입니다. 그것은 자체적으로 독립적인 회로이며 json 파일은 번역 소스에 대해 훨씬 덜 구체적입니다.

또한 두 가지 데모 중에서 ngx-translate가 훨씬 느린 것 같습니다. 유지 관리가 더 쉽다는 것은 무엇을 의미합니까?

@tatsujb th ng-i18n-aot-loader 개발자로서 적어도 로더를 통합하는 것이 구현하기 다소 어렵다는 것을 알고 있습니다.
다른 모든 것은 원래 각진 i18n 패러다임을 따르기 때문에 케이크 조각입니다.

태그 구조 등의 주요 변경 사항이 없는 한 v7에서 작동해야 합니다.

ngx-translate를 구현하려고하는데 번역 가능한 장소로 번역 가능한 장소로 이동해야합니다. 이미 미리 계획했던 i18n 태그를 사용할 수 없다는 사실이 저에게는 약간 우스꽝스럽습니다.

너를 믿는 것이 잘못된 선택이라고 생각하기 시작했어, @digismack

@tatsujb 58명이 이 이슈를 팔로우하고 있습니다. 개인적으로 i18n에 관한 Angular 팀의 업데이트를 따르고 있습니다. OP의 내용과 관련이 없는 한 잡담을 중단해 주시면 감사하겠습니다.

새로운 i18n 기능을 Angular에 추가하고 싶다면 주저하지 말고 아래에 문의하세요. 가능한지 그리고 문제를 제기해야 하는지 알려 드리겠습니다.
버그가 있는 경우 문제를 엽니다(여기에서 이에 대해 논의할 필요 없음).

다른 라이브러리에 문제가 있는 경우 StackOverflow에 질문하는 것이 좋습니다.

문제를 작성/댓글하는 것은 제 습관이 아니지만... 그렇게 하겠습니다!
고려하면 :
@gtbuchanan 과 CO는 A형 입니다.
@tatsujb 외 불평/댓글/기대하는 사람은 B형 입니다.

A형 늘 똑같은 말만 반복해도 지치지 않으세요?!?! 나에게 당신은 B형보다 더 짜증난다.

Angular Type B의 i18n 누락된 기능으로 인해 문제를 "구독"하는 것보다 사람들이 더 좌절합니다(친구를 사귀기 위한 것이라면 Facebook에서 좋아요를 눌러 보세요. , 당신은 말을 바꾸거나 그렇게 말하는 것을 발명하지 않을 것입니다!...)

유형 A는 구독을 취소하거나 업데이트를 기다리거나 변경 로그를 빠르게 확인하거나 블로그/뉴스를 읽을 수 있다고 생각합니다. Angular 팀은 큰 글꼴 ARIAL 72pixel로 표시하여 ts+runtime i18n에서 i18n dynamic translate를 소개합니다: big feature missing in angular ! 그들은 그것을 크게 고려하지 않았으므로 오늘날 올바른 i18n이 없습니다. 이것은 Google 정도의 전략이며 변경할 수 없습니다!

B는 이 기능을 2년 전에 기다립니다. https://github.com/angular/angular/issues/9104#issue -159302131 Angular 2.X 이후로 그렇습니다!

답답한 B형을 존중하고 악의를 품지 말라고 말하고 싶다. 아무도 i18n에 대해 많이 불평하지 않는다면 i18n 개선이 앞으로 몇 년 동안 고려되지 않을 것이라고 생각합니다. 이것도 오픈 소스에 적합합니다! 비평가를 불평하십시오! 전략은 바뀔 수 있습니다! 그래서 사람들이 불평을 하고 구독을 취소하도록 하십시오. 이 호에 가입하지 않고도 귀하의 정보를 찾을 수 있습니다.

B형 당신이 할 수 있을 때까지 불평/댓글을 계속하십시오! 그것은 사람들의 필요를 이해하는 유일한 최선의 방법입니다!

스트라이크 스트라이크 ㅋㅋ

@tatsujb 모든 것은 개인 취향에 달려 있습니다. ng-i18n-aot-loader 를 마지막으로 구현했을 때 작동하도록 하려면 꺼낸 빌드를 실행하고 webpack 구성을 사용자 지정해야 했습니다. 어쩌면 더 이상 그렇지 않을 수도 있습니다. 그러나 꺼낸 빌드를 실행하면 Angular CLI 도구를 더 이상 사용할 수 없습니다. 따라서 장기적으로 ngx-translate 를 구현하고 약간 다르게 작동한다는 사실을 처리하는 것이 더 쉽다는 것을 알았습니다.

@gtbuchanan 나는 당신의 고통을 느끼지만, 이 "수다"는 OP의 게시물에 언급된 기능의 범위와 직접적인 관련이 있습니다. Runtime i18n (one bundle for all locales with AOT) 의 기간이 계속 미뤄졌기 때문에 사람들은 여전히 ​​현재 솔루션을 찾기 위해 이 스레드를 찾고 있습니다.

@ocombe , 이제 데이터베이스에서 번역을 가져올 새 프로젝트를 시작하려고 합니다.
우리의 Angular 모듈은 느리게 로드되며 I18N과 관련하여 Angular가 제공하는 것에 최대한 가깝게 유지하고 싶습니다.

Angular I18N 지원이 계획대로 최신 릴리스에 포함되지 않았기 때문에 지금 막 새로운 프로젝트를 생성하려는 우리와 다른 사람들에게 해줄 말씀이 있습니까?

예를 들어, I18N이 ​​준비될 때까지 우리는 ngx-translate를 사용할 수 있지만, 나는 그 프로젝트의 github 이슈 어딘가에서 그것이 지연 로딩을 지원하지 않는다는 것을 읽었습니다. 이것은 우리에게 쇼 스토퍼가 될 것입니다.

그런 다음 Angular의 I18N 지원은 아직 황금 시간대에 준비되지 않았습니다.

나는 곧 있을 프로젝트에 무엇을 사용할 것인지에 대한 올바른 방향을 알려주는 몇 가지 힌트를 정말 감사하게 생각합니다.

필수품:

• 지연 로딩

가져서 좋다:

• 중환자실 표현

메르시

이 문제의 추종자들을 위해 @ocombe 는 몇 시간 안에 angularconnect에서 런타임 i18n 에 대해 이야기할 것입니다. 나는 적어도 열린 질문 중 일부는 거기에서 답을 얻을 것이라고 가정합니다. 사용 가능한 라이브 스트림 이 있습니다

@ctaepper - 정보를 주셔서 대단히 감사합니다!

@guygit ngx-translate 또는 angular-l10n 수 있습니다. 여기 내가 만든 비교 테이블이 있습니다. https://medium.com/@sergeyfetiskin/tools -to-translate-your-angular-app-c021e25ff26a

우리 앱의 경우 몇 가지 제한 사항이 있더라도 Angular 방식을 사용하기로 결정했습니다.

@fetis 정말 감사합니다 - 잘 보고 갑니다 :-)

번역 파일용 XLIFF 파일 선택에 대해 궁금합니다. Google 번역 툴킷과 Flutter/Dart i18n은 모두 ARB 파일을 지원하지만 XLIFF는 지원하지 않습니다. ARB 파일 지원이 예정되어 있지 않다고 들었는데, 이것이 다시 고려될 수 있는 부분인지 궁금합니다. 또는 누군가( @ocombe ?)가 Angular가 XLIFF 파일과 상호 작용하는 위치를 가리킬 수 있으므로 ARB 지원을 통합하는 것이 얼마나 어려운지 확인할 수 있습니다.

(일부 상황에서는 모바일 앱에 Flutter/Dart를 사용하고 웹 앱에 Angular를 사용할 예정이며 가능하면 모바일과 웹 간에 번역 파일을 공유하고 싶습니다. ARB -> XLIFF 변환기를 Angular에 포함할 생각이 없는 경우).

@localpcguy 변환기 종류를 작성하게 된다면 이미 많은 형식에서/로 변환을 제공하고 있는 https://github.com/translate/translate 에 기여하는 데 관심이 있을 수 있습니다.

참고로 ocombe는 몇 달 전에 PO 파일(및 JSON?)을 지원하기 위해 열심히 노력할 것이라고 말했습니다. 우리가 XLIFF와 함께 작동하는 okay-ish 도구를 찾는 데 어려움을 겪었기 때문에 언젠가는 일어날 것입니다.

XLIFF와 함께 사용할 okay 같은 도구를 찾는 데 어려움을 겪었기 때문입니다.

@PowerKiKi 그것은 사실이 아닙니다. 거의 모든 온라인 번역 관리 도구는 XLIFF 형식을 지원합니다. .xliff를 수동으로 편집하고 싶지 않다면 무료 데스크톱 번역 프로그램도 있습니다.

@fetis 나는 주제에서 벗어나는 것을 싫어하지만 도구와 함께 XLIFF를 사용하는 것과 관련하여 상당한 고통을 발견했습니다. 여기에서 내 의견을 참조하십시오. https://github.com/angular/angular/issues/20193#issuecomment -345755889

우리는 여전히 좋은 것을 찾지 못했고 아직 XLIFF 2를 지원하는 것을 찾지 못했기 때문에 그러한 도구에 대한 참조를 제공하십시오. Smart Cat은 멋지게 보이지만 문자열을 업데이트하면 내 눈을 측정하고 싶어집니다.

당신은 우리가 모르는 것을 알고있는 것 같습니다 :)

Pootle은 https://github.com/translate/translate 를 사용하고 Gettext(po 파일)에 정말 훌륭했지만 자리 표시자/태그를 지원하지 않으며 누군가의 기여를 기다리고 있습니다.

저는 이 문제를 1년 정도 구독했습니다. 이 점에서 진행 상황은 Angular 팀의 우선 순위가 아닌 것 같고 모든 언어에 대해 한 번 앱을 컴파일하고 동적 번역을 수행하기 위해 후프를 거쳐야 하는 것은 허용되지 않습니다. 가능하다면 원하는 다른 i18n 라이브러리를 사용하는 사용자 지정 파이프를 만드는 것이 좋습니다. 순수하기 때문에 이 파이프는 앱을 여러 번 컴파일하는 데에도 똑같이 효율적입니다. 또한 Angular에 의존하지 않는 i18n을 사용하면 코드에서 동적인 번역을 쉽게 수행할 수 있습니다. 또 다른 장점은 번역이 더 이상 Angular에 의존하지 않으므로 원하는 경우 일부 구성 요소를 다른 프레임워크로 마이그레이션하기 시작하거나 원하는 번역 형식과 도구를 자유롭게 선택할 수 있다는 것입니다. 저는 https://airbnb.io/polyglot.js/ 를 사용하고 있으며 매우 만족하며, Angular i18n에서 다중 언어로의 내 앱 마이그레이션이 여전히 진행 중일 때도 결과와 제거에 이보다 더 만족할 수 없습니다. Angular i18n과의 종속성.

메일로 알림을 받고 제 의견은 신경쓰지 않으실 분들께 죄송하지만, 알림을 너무 오랜만에 읽어서 구독을 취소하기 전에 작별인사를 드려야 할 것 같습니다. :)

건배!

이 점에서 진행 상황은 Angular 팀의 우선 순위가 아닌 것 같고 모든 언어에 대해 한 번 앱을 컴파일하고 동적 번역을 수행하기 위해 후프를 거쳐야 하는 것은 허용되지 않습니다.

런타임 i18n은 Angular 팀의 최우선 과제입니다. 그러나 차단으로 인해 새로운 Ivy 렌더러가 발생합니다. 현재까지 프로젝트 진행 상황은 양호하며 Angular 8용 Ivy를 기대할 수 있습니다. 관련된 모든 사람에게 어려운 상황임을 이해합니다. 계획은 있지만 Ivy가 완료되지 않는 한 실행할 수 없습니다.

최근 런던에서 열린 AngularConnect 컨퍼런스(2018)의 강연, 특히 Olivier Combe의 "Runtime i18n"과 Alex Rickabaugh의 Day 2 기조 연설을 참조하십시오.

실제로 내 경험은 @intellix와 비슷합니다.

XLIFF 1.2 는 10년이 되었지만 오픈 소스 프로젝트에서 지원이 상당히 빈약한 것 같습니다. Pootle은 https://github.com/translate/pootle/issues/4762 및 https://github.com/translate/pootle/issues/1811에 따라 palceholder를 지원하지 않습니다. PR이 곧 지원을 추가할 수도 있지만 Weblate 도 지원하지 않습니다 .

데스크톱에서 Virtaal은 XLIFF 자리 표시자를 지원 _하지 _ 하지만 최신 릴리스 0.7.1 은 6년 된 것이며 최신 macOS에서 더 이상 작동하지 않습니다. 불행히도 겉보기에 단순함에도 불구하고 아직 병합되기를 기다리고 있는 아주 오래된 PR 과 함께 잘 관리된 프로젝트의 인상을 주지는 않습니다. 그리고 지난 몇 년 동안 매우 낮은 커밋 활동 .

며칠 전에 출시된 Poedit 2.2가 XLIFF 1.2 및 2.0을 지원한다는 것을 방금 알았습니다. 불행히도 현재 설치할 때 snapcraft.io CDN에서 오류가 발생하여 테스트할 수 없습니다. 그러나 이것은 데스크탑 사용자에게 최고의 솔루션일 수 있습니다.

@fetis 자리 표시자를 지원하는 XLIFF 1.2 또는 더 나은 XLIFF 2.0을 편집하기 위한 일부 오픈 소스(또는 최소한 무료로 사용할 수 있는) 프로젝트를 찾은 경우 여기에 나열하십시오. 내가 테스트한 다른 모든 것은 전혀 작동하지 않거나 사용하기 매우 복잡했습니다.

@intellix @PowerKiKi 여기 내가 아는 목록이 있습니다. 우리의 목표는 다양한 국가의 번역가/동료와 협업할 수 있는 온라인 번역 플랫폼입니다. 모든 공동 작업자를 위해 데스크톱 소프트웨어를 설치하고 XLIFF 파일 동기화를 관리하는 프로세스를 거치는 것은 우리에게 선택 사항이 아닙니다. 그래서 저는 데스크탑 도구, 플랫폼을 테스트하지 않았습니다.

애플리케이션
오메가T
https://omegat.org/

자체 호스팅
https://weblate.org/en/ +유료 호스팅
https://pootle.translatehouse.org/
https://pontoon.mozilla.org/

플랫폼
크라우딘
https://crowdin.com/
CLI 지원

WebTranslateIt
https://webtranslateit.com/
CLI 지원

트랜시펙스
https://www.transifex.com/

프레이즈앱
https://phraseapp.com/

현지화
https://lokalise.co/
CLI 지원

_저렴한 가격에 충분한 기능을 제공하는 Lokalise로 프로젝트를 마치겠습니다._

~포에디터~
https://poeditor.com/pricing/
선언된 XLIFF 지원은 Angular 형식에서 작동하지 않습니다.

오픈 소스 솔루션을 찾고 있다면 이 목록이 유용할 수 있습니다. https://opensource.com/article/17/6/open-source-localization-tools

사이드 노드
XLIFF 2.0을 지원하는 온라인 플랫폼을 본 적이 없었고 저에게는 큰 놀라움이었습니다. XLIFF 1.2는 공식적으로 더 이상 사용되지 않는 것으로 표시되어 있으며 업계의 아무도 v2를 지원하지 않았습니다.

POEdit가 XLIFF 지원을 선언했다는 소식을 듣고 기쁩니다. .po 파일에 사용했는데 좋았습니다.

추신: 여기서 주제를 벗어나게 해서 매우 유감입니다. 하지만 동시에 앱에서 XLIFF 파일을 가져오는 것은 여정의 일부일 뿐이므로 앱 수명 주기 동안 번역하고 유지 관리해야 합니다. 그래서 중요한 토론입니다. 나는 어딘가로 이사할 것을 제안하고, 이 목록을 Medium 기사로 넣을 수 있고 거기서 토론을 계속할 수 있습니다.

@localpcguy 다양한 형식이 있지만 모두 지원 가능한 형식에 달려 있습니다. 직렬 변환기를 작성하고 유지 관리하려면 시간이 걸립니다. Xliff 2는 다른 누군가가 PR로 추가했기 때문에 지원을 추가했습니다(그렇지 않으면 지원하는 데 시간이 걸리지 않았을 것입니다).
추출과 병합이라는 두 가지를 위해 직렬 변환기가 필요합니다.
Angular Connect에서 이에 대해 이야기하지는 않았지만 외부 직렬 변환기를 사용할 수 있기를 바랍니다. ivy를 사용하여 런타임(병합)을 수행하는 것은 매우 쉬워야 하지만 컴파일러를 변경할 때 직렬 변환기를 업데이트해야 하기 때문에 추출은 여전히 ​​복잡합니다.
나는 그것을 하는 방법에 대한 몇 가지 아이디어가 있지만 담쟁이덩굴이 착륙하면 그것에 대해 팀과 이야기해야 합니다. 내가 정말로 하고 싶은 것은 Angular i18n을 사용하여 ngx-translate를 다시 작성할 수 있도록 최소한 JSON 지원을 추가하는 것입니다(많은 사람들이 원하기 때문에).

@ocombe 에게 감사드립니다(그리고 다른 모든 입력, 저는 다양한 보기를 보는 것을 좋아합니다). #14185가 당신이 언급한 PR인 것 같습니다. ARB 지원을 추가하려는 경우 여전히 좋은 출발점입니까? 제출할 경우 잠재적으로 병합될 수 있습니까?

@localpcguy 내일 회의가 있어 이에 대해(및 기타 사항) 논의할 예정입니다. 진행 상황을 알려 드리겠습니다.

자, 우리가 생각하는 작동 방식은 다음과 같습니다. 추출을 위해 누구나 원하는 형식으로 후처리할 수 있는 일종의 json 형식(번역을 위한 공식 json 형식이므로 ARB일 수도 있음)으로 문자열을 추출합니다. (json은 사용하기 정말 쉽습니다.) 런타임을 위해 형식을 이해하는 고유한 로더를 작성하는 데 사용할 수 있는 일종의 인터페이스를 제공합니다.

그래서 이것은 우리가 앱에 로더를 제공할 수만 있다면 어떤 종류의 번역 형식도 자유롭게 사용할 수 있다는 것을 의미합니다.

글쎄, 이것은 굉장할 것이다 :+1:

예, 심층 최적화에 액세스할 수 없지만(언어당 하나의 번들을 생성하기 위해 빌드 시 문자열을 교체합니다. 즉, 번역이 구성 요소와 함께 분할됨을 의미합니다) 원하는 모든 종류의 지연 로딩 솔루션을 사용할 수 있습니다. 앱이 시작될 때 모든 번역을 로드하는 한(구성 요소가 생성되기 전에 동기적으로 로드해야 함)
또한 아이비에서 제공하는 새로운 지연 로딩 기능을 사용하여 새 구성 요소를 로드할 때 수동으로 코드를 분할하고 라우터와 비동기식으로 로드할 수도 있습니다(Jason은 Angular Connect에서 데모를 수행했습니다).

Ivy에서 즉석에서 언어를 전환하는 베타 데모(파일만 비디오나 라이브 스트림이 아님)를 기대할 수 있습니까? POC 결승전 아이비를 조합하는 것은 라인 폭격을 감지하는 좋은 방법이 될 수 있습니다.

개발자의 땀을 live-i18n에 넣기 전에 담쟁이덩굴이 좀 더 자리 잡기를 기다리는 방식에 동의하지 않는 것이 아니라, 1인 소규모 POC가 예측하고 잠재적으로 live-i18n이 2020년으로 밀려나는 것을 피할 수 있습니다.

외부 사용자를 위한 런타임 서비스는 아직 완료되지 않았으며 Google 앱으로 ivy를 테스트하는 데 필요했기 때문에 클로저( goog.getMsg )를 사용하는 코드만 있습니다.
앞으로 몇 달 동안 이 작업을 수행할 것입니다. 이것은 아마도 아직 아이비와 함께 i18n을 사용할 수 없다는 것을 의미합니다.
런타임 i18n에 대한 코드는 어제 방금 병합되었으며 i18n에 대한 컴파일러 코드는 앞으로 며칠 내에 병합되어야 합니다. 그런 다음 위에서 언급한 새 로더와 코드에서 번역을 사용하는 서비스를 포함하여 외부 사용자를 위한 새 서비스에 대해 작업합니다.

즉석에서 언어를 전환하려면 앱을 완전히 다시 로드하거나 경로를 변경해야 합니다(모든 기존 구성 요소를 정리함). 나는 아직 POC 작업을 시도하지 않을 것입니다.

즉석에서 언어를 전환하려면 앱을 완전히 다시 로드하거나 경로를 변경해야 합니다(모든 기존 구성 요소를 정리함). 나는 아직 POC 작업을 시도하지 않을 것입니다.

그건 공평하지만 ...하지만 앱을 완전히 다시 로드할 필요는 없습니다(또는 최종 사용자의 눈에 완벽함을 달성하는 모든 것, 일명 저장소도, 인증도, URL도 손실되지 않습니다. 음... /en/... 에 대해 설명하지 않음)

@tatsujb 앱을 새로고침하면 페이지가 새로고침되는 것이 아니라 StackBlitz가 편집할 때마다 앱을 새로고침합니다. 눈에 보이는 것이 느껴지나요?

앱을 다시 로드한다는 것은 앱을 마운트 해제한 다음 SSR-CSR 전환(CSR-CSR)에 해당하는 동일한 위치에 앱을 마운트하는 것을 의미하며 적절한 캐시 아키텍처를 고려하는 경우 후속 부트스트랩 프로세스에서 비동기 작업이 없어야 합니다.

이 올바른 설정으로; 변수 값을 저장하고 인증(스크롤 가능한 div의 스크롤 양도 포함)이 유지됩니까?

@tatsujb 예를 들어 어휘 변수 또는 창 속성과 같이 Angular 생성 인스턴스 외부에 저장되는 한.

@trotyl 페이지 없이 앱을 어떻게 새로고침합니까?

@saithis 당신은 항상 platformBootstrap().bootstrapModuleFactory() (또는 기타 동등한)로 애플리케이션을 명령적으로 부트스트랩합니다. 언제 어디서나 호출할 수 있습니다. 호출 시 마법이 없습니다(Angular CLI에는 현재 코드 교체에 대한 제한이 있으며 더 이상 아이비의 문제).

스크립트 호출 시 열심히 부트스트랩하고 영원히 유지(마운트 해제하지 않음)하는 것은 SPA의 일반적인 관행이지만 아무도 그렇게 하도록 강요하지 않습니다.

편집: 누군가 그렇게 하는 경우 메모리 누수를 방지하기 위해 부트스트랩된 NgModuleRef 도 파괴 해야 합니다. 이것들은 주제에서 벗어난 질문이며 다른 채널에서 논의하는 것이 좋으며 여기에서 i18n 토론을 추적하는 것이 좋습니다.

@trotyl 감사합니다. 부트스트랩이 다시 작동하는지 몰랐습니다.

@ocombe 여기에서 스팸을 제거해 주시겠습니까? 그리고 내 댓글도.

1. @fetis 에게 : 당신과 같은 사람들은 이슈를 팔로우 해제하고 출시를 위해 구독해야 합니다.
   

2. @Andrulko 에게 : 우리는 상관하지 않습니다

3. @ angular로 : 여기에서 불평하는 것을 완벽하게 이해합니다! 우리가 vX용이 아닌 v7용 아이비를 원하거나 v7용으로 크게 개선된 제품을 판매하지 않는 반면 귀하가 이에 응답할 수 없거나 마감일을 준수하기 위해 7.x에 넣을 것입니다... 이것은 공평하지 않습니다! 예 옵션은 아무 것도 발표하지 않는 것이어야 하며 아무도 이것이 나쁜 생각이라고 불평하지 않을 것입니다. 프레임워크에서 자신의 위치를 ​​정해야 합니다. 예, 우리는 v2 이후 올바른 i18n을 기다립니다. 큰 앱에 대한 이 필수 측면에서 50000개의 문자열을 포함하는 국제 웹 앱과 같은 큰 앱에 대한 각도 준비를 판매할 수 없습니다. 물론 당신은 이것을 읽는 것을 좋아하지 않지만 동정심과 좋은 믿음, imho 우리가 i18n을 고려하지 않고 다른 모든 측면에 대해 느린 빌드 시간/개발 시간을 고려하지 않으면 각도가 굉장하다고 말할 수 있습니다. 특정 방향은 상단에서 변경되어야 하며 물론 결정자에게 말하고 있습니다. big-google에서 우리는 이와 같은 큰 실수를 할 수 없었기 때문에 우리로부터 높은 예외 (비판). 나는 exceptionels와 같은 Google 개발자를 봅니다. 실수가 없는 똑똑한 사람들은 경험 많은 개발자와 Google과 같은 devteam에게 이런 일이 일어나서는 안 됩니다! 내 글로벌 의견은 회사가 선택한 다음 공개 소스가 무엇인지 개인 회사에 판매/설명할 때 빅 앱에 대해 Angular 100%를 판매하지 않습니다!

4. @ 특히 비즈니스 회사에서 일하지 않는 사람들을 위해: 오픈 소스를 존중하지 않기 때문에 내 댓글이 싫어요?!?!, lol go go my boss to wait.. to wait... angular를 선택한 후 우리가 믿기 때문에 큰 앱을 위해 준비되었습니다(80%가 아닌 100%)... 우리는 의존합니다!

우리가 배를 떠나기 때문에 이것은 여기에서 나의 마지막 코멘트입니다! 구독 취소 + 다음 프로젝트에서 Angular를 선택하지 않음(당신이 승자라고 말할 수 있습니다. 오픈 소스 프로젝트에는 우리 같은 사람이 필요하지 않습니다)

그런 열정! 균형을 위해... Angular 6으로 앱을 다시 작성하고 6개 언어로 국제화했으며 약간의 불편함만 느꼈습니다. 물론 더 빠른 빌드 시간과 즉석 번역은 확실히 좋지만 세상의 종말은 아닙니다. i18n이 아닌 프레임워크의 98%는 굉장합니다. 잘했어! 새로운 기능을 기대합니다.

우리는 또한 새로운 엔터프라이즈 포털을 위해 Angular에 대한 환상적인 경험을 가지고 있습니다. i18n은 스위스에서 4개 언어를 지원해야 하기 때문에 필요한 마지막 누락 기능입니다. 저는 여기서 문제가 소통에 있다고 생각합니다. 프로젝트 계획을 위해 1년 전에 i18 릴리스를 더 잘 예측했다면 이를 계획하고 다른 가능성을 고려할 수 있었을 것입니다. 즉, 우리는 어떤 업데이트를 듣기를 고대하고 있습니다. :-)

각도를 방어하기 위해 다음과 같이 프로덕션에서 충분히 간단하게 사용할 수 있습니다(내가 찾은 최고의 솔루션).

1. 번역 논리를 어딘가로 이동하기 위해 번역된 가변 텍스트를 자체 구성 요소에 래핑합니다.

parent-component.component.html

<app-route-translation
  [routeData]="routeData"
></app-route-translation>

route-translation.component.html

<span
  i18n="route text|Navigation text for route@@routeText"
>{
  routeData.langKey, select,

  home-1 {Home 1}
  home-1-1 {Home 1-1}
  home-1-2 {Home 1-2}
  home-2 {Home 2}
  home-2-1 {Home 2-1}
  home-2-2 {Home 2-2}
  home-root {Home root}
  lazyPage {Lazy page}
  notFound {404}

  other {Other}
}</span>

1. 다음과 같이 angular.json에서 빌드 구성 폴더를 구성하십시오.

"prod-en": {
  ...
   "outputPath": "dist/en/",
  ...
},
"prod-ru": {
  ...
   "outputPath": "dist/ru/",
  ...
}

1. 다른 언어에 대해 앱을 컴파일하려면 이와 같이 도커 빌드 파일을 구성하십시오.

FROM node:8 as build-stage
WORKDIR /app
COPY angular-util .
RUN npm install
RUN npm run ng build -- --configuration=prod-en
RUN npm run ng build -- --configuration=prod-ru

FROM nginx
WORKDIR /usr/share/nginx/html
COPY --from=build-stage /app/dist .
COPY nginx.conf /etc/nginx/conf.d/default.conf

1. 이 nginx.conf를 사용하여 하위 도메인(예: en.site-name.com, ru.site-name.com)에서 앱을 제공합니다. 여기서 ru set $subdomain ru; $3$#$는 기본 로케일로 바꿔야 합니다.

server {
  listen 80;
  set $subdomain ru;
  if ($host ~ ^(\w+)\.) {
    set $subdomain $1;
  }
  location / {
    root /usr/share/nginx/html/$subdomain;
    try_files $uri $uri/ /index.html =404;
  }
}

자세한 내용은 여기를 참조하십시오
https://github.com/ivanivanyuk1993/angular-util/tree/master/src/app/util/shared/route-list
https://github.com/ivanivanyuk1993/titans-shoulders-project/tree/master/container-description/ui-container-description

나는 이 댓글에 엄지손가락을 치켜세우고 싶다. 완벽하지는 않지만 웹에서 찾은 이 주제에 대한 가장 유용한 게시물입니다.

여러분, 안녕하세요,

내 프로젝트에 i18n 번역을 사용하고 있습니다. 다음과 같은 부분에 의문이 있습니다.

1. 다른 라이브러리에 대해 다른 xlf 소스 파일을 생성할 수 있습니까(ng generate library libraryName 명령을 사용하여 생성)?
2. select 또는 pluralization에 대한 국제화를 사용하는 동안 생성된 xlf 소스 파일은 다른 대안에 대한 trans-unit id를 생성합니다. 다른 대안에 대해서도 템플릿을 통해 id를 제공할 수 있습니까?(아래 이미지 참조)
   

몇 가지 답변을 도와주세요.

@leanersLicense :

1. cli가 처리하는 프로젝트당 하나의 번역 파일을 추출할 수 있어야 합니다. 즉, 번역은 현재 라이브러리에서 작동하지 않습니다(즉, 라이브러리를 사용하는 누군가가 해당 라이브러리에 대한 번역을 로드할 수 없음을 의미합니다). 우리가 구현할 다음 기능에 대한 할 일 목록의 맨 위에 있습니다(코드 번역 포함).

1. 나는 그것이 가능하다고 생각하지 않는다. <div i18n>Some value: {{ valueA // i18n(ph="PH_A") }}</div> 와 같은 특별한 주석으로 자리 표시자의 이름을 지정할 수 있지만 ICU 표현식 @AndrewKushnir 에서는 작동하지 않는다고 생각합니다.
   기능을 요청하거나 https://github.com/angular/angular/issues/24080 에 비슷한 의견을 추가할 수 있습니다(ICU 표현식에 desc / 의미 추가).

라이브러리를 사용하는 사람은 해당 라이브러리에 대한 번역을 로드할 수 없습니다.

이 문제를 해결하는 한 가지 방법은 다음과 같습니다.
1) 라이브러리에서 i18n을 xliff로 추출하고 번역합니다.
2) 라이브러리 패키지와 함께 xliff 파일 배송

3) 소비자는 자신의 xliff 파일도 추출합니다.
4) 소비자는 xliff를 xml 파서에 로드합니다. node_modules에서 시작된 모든 트랜스 유닛을 삭제합니다.
5) 소비자는 xliff를 라이브러리 xliff와 연결합니다.

귀하의 라이브러리를 사용하는 누군가가 해당 라이브러리에 대한 귀하의 번역을 로드할 수 없음을 의미합니다.

이 설명을 오해하고 있는 것일 수도 있지만 xlf 파일을 빌드할 때 회사 응용 프로그램에 대한 번역 설정에 다른 프로젝트의 템플릿에 지정된 키가 포함되어 있다는 것을 알고 있습니다. 마음에 떠오르는 것은 https://github.com/ng-bootstrap/ng-bootstrap 입니다.

현재로서는 불가능한 것 같습니다.

<my-button i18n-title="@@SHARED_GO_LABEL" [title]="'Go'" [button-style]="'primary'" (click)="navigateToForm()"></my-button>

이러한 변경 사항의 범위 내에서 이 문제가 해결됩니까(또는 내가 뭔가 잘못하고 있습니까)?

@mikejr83

그것은 가능하다. title [title]="'Go'" title="Go" 로 지정하면 됩니다.

귀하의 답변과 제안에 대해 @ocombe 및 @ewok-janitor에게 감사드립니다. 👍

@ocombe 도서관 번역이 가능한 잠정 날짜가 있습니까?

지금은 날짜가 없습니다. ivy의 첫 번째 릴리스에서 우리는 기능 패리티를 갖기 위해 노력하고 있습니다. 우리는 새로운 기능(코드 번역 및 라이브러리 지원 포함)에 대해 작업 직후(또는 실제로 이전에 작업을 시작하지만 ivy가 알파로 출시될 때 완료되지 않을 것입니다) 작업할 것입니다. ivy가 기본값이 되기 전에 사용할 수 있습니다.

xliff 파일에 대한 수정 사항이 이미 있습니까? https://github.com/angular/angular/issues/17506
참조가 고정되어 있지 않는 한 형식을 전혀 사용하는 것은 불가능합니다.

@ocombe 경로 번역을 지원할 계획이 있습니까?

몇 번이나 요청을 받았습니다. 예, 즉각적인 계획은 아니지만 해야 할 일 목록에 있습니다.

안녕하세요, ivy가 베타 버전으로 출시되었을 때 런타임 i18n을 사용하는 방법에 대한 문서가 있습니까?

@marcelnem , 이 URL을 확인하면 모든 문서 포인트가 보류 중입니다.

https://is-angular-ivy-ready.firebaseapp.com/#/status

@ocombe 지금 Google에서 하고 있는 훌륭한 일입니다. Angular i18n은 처음부터 ngx-translate와 같은 '무언가'여야 했습니다. Angular 8/9가 출시되면 ngx-translate에서 Angular i18n 스타일로 마이그레이션하는 마이그레이션 가이드, 자동화 도구, 기능 비교 등이 있는지 궁금합니다.

안녕 오컴
위에서 언급한 기능에 대해 확인해야 합니다.
런타임 i18n(AOT가 있는 모든 로케일에 대한 하나의 번들) - [작업 중] >> 이것이 아직 진행 중입니까, 아니면 종료입니까?

아직 진행 중인 경우 해결 방법을 알려주시겠습니까?
감사합니다

@ocombe 위에서 언어 패키지는 레이스 로딩으로 로드해야 한다고 썼습니다. index.html에서 직접 언어 팩을 로드할 수도 있습니까? 애플리케이션이 AWS Lambda를 통해 실행되고 컴파일된 각도 파일이 S3 버킷에 저장되는 경우가 있기 때문입니다. 이것은 실제로 이미 작동하는 해결 방법이지만 Angular는 다른 호스트에서 파일을 레이스로 로드할 수 없기 때문에 레이스 로드를 사용할 수 없습니다. 따라서 Angular에 필요한 모든 파일은 이미 index.html에 포함되어 있어야 합니다(여기서 스크립트를 통해 S3 호스트를 추가함).

@nidhi8953 여전히 WIP이며 ivy와 함께 사용할 수 있습니다. 현재로서는 Google 내부에서만 작동합니다(번역에 내부적으로 Closure Compiler를 사용하기 때문입니다). 번역을 처리할 런타임 서비스는 외부 세계에 대해 매우 실험적입니다. 몇 가지를 테스트 하려면 https://github.com/angular/angular/blob/master/packages/core/test/bundling/hello_world_i18n/index.ts 예제를 볼 수 있지만 알아야 합니다. 기능은 여전히 ​​비공개이므로 가까운 시일 내에 이름이 변경되고 변경될 것입니다. 현재 목표는 v8이 출시되면(월말에) 견고한 API 세트 작업을 시작하고 v9가 출시될 때까지 전체 v8에 대해 이를 반복하는 것입니다. 이 시점에서 API는 안정적인 것으로 간주되어야 합니다.

@vekunz 우리가 현재 계획을 따르면 가능해야 합니다. 어쨌든 응용 프로그램의 부트스트랩에 번역 파일을 로드해야 하기 때문입니다.

@ocombe Ivy(현재 8.0.0-rc.3)를 사용하고 다중 빌드의 Angular 7 방법을 사용하여 i18n을 구현할 수 있습니까? 아니면 Ivy용 i18n API가 출시될 때까지 Angular 7을 계속 사용해야 합니까? 가능하다면 Ivy를 활용하는 동시에 새로운 런타임 방법을 사용할 수 있을 때까지 i18n의 이전 방식을 사용하고 싶습니다.

업데이트: 시도한 후 ng xi18n 추출(#https://github.com/angular/angular-cli/issues/14225 참조)이나 i18n을 통한 빌드 모두 효과가 없습니다. .xlf 파일을 내보내지 않고 단어를 번역하지 않습니다. 그러나 tsconfig.app.json에서 enableIvy 옵션을 false로 설정하면 둘 다 버전 8.0.0-rc.3에서 잘 작동합니다. 즉, i18n을 잃지 않고 Angular의 업그레이드 경로를 따를 수 있고 차등 로딩과 같은 새로운 이점을 얻을 수 있으며 i18n이 작동하면 Ivy를 켤 준비가 됩니다.

@jacobbowdoin ivy에서는 작동하지 않지만 활성화되지 않은 경우 작동합니다.
나는 오래된 추출/로딩 시스템이 ivy와 함께 작동하도록 만들고 싶었지만 일시적이었을 것이기 때문에 팀에서 우선 순위로 결정하지 않았습니다(이해할 수 있는, 필수 작업을 먼저 작동시키는 것이 우선 순위입니다).

@ocombe 안녕하세요, 우리는 지금 i18n을 개발하고 싶기 때문에 런타임-i18n을 기다릴 수 없습니다. 여전히 ngx-translate를 사용하는 것이 좋습니까? i18n-polyfill과 함께 사용하는 것이 합리적입니까? i18n-polyfill을 사용하면 runtime-i18n으로 더 쉽게 마이그레이션할 수 있습니까?

ngx-translate를 사용하는 경우 i18n-polyfill을 사용하지 마십시오. 템플릿에 각도 i18n을 사용하는 경우에만 사용하는 것이 좋습니다.
ngx-translate는 여전히 관련성이 있으며 사용하기 쉽습니다. 여러 빌드(로캘당 하나씩)를 지원하기 위해 모든 인프라를 배치할 필요는 없습니다.

@ocombe 안녕하세요. 상태 업데이트가 있습니까?

-런타임 i18n
-템플릿 외부에서 번역 문자열 사용 - #11405

우리는 현재 소스 코드 번역을 기다려야 하는지 아니면 i18n-polyfill을 사용해야 하는지 논의 중입니다(이미 i18n으로 시작했습니다). 몇 주 정도는 쉽게 기다릴 수 있으므로 대략적인 일정을 알려주시면 감사하겠습니다. 매우 감사합니다!

@halilovicedvin ivy가 Google 앱의 기본값이 되자 마자 외부 사용자를 위한 런타임 i18n 서비스 작업을 시작하므로 곧 v9 사이 어딘가에 있습니다.
사람들이 며칠 휴가를 내기 때문에 여름이 지나야 믿을 수 있어요.

@halilovicedvin 우리는 몇 주 전에 i18n-polyfill과 함께 i18n을 시작했고 훌륭하게 작동합니다. runtime-i18n이 i18n-polyfill과 같은 방식으로 사용되기를 바랍니다.

@vekunz 나도 ngx-translate 를 i18n-polyfill과 함께 사용하면 runtime-i18n으로 더 쉽게 마이그레이션할 수 있기를 바랐지만 @ocombe (https://github.com/angular/angular/issues의 의견 이후) /16477#issuecomment-498239301) 폴리필을 설정하기 위한 추가 노력이 정당한지 잘 모르겠습니다. 아마도 우리는 ngx-translate만을 사용할 것입니다.

@vekunz 설정한 경험은 무엇입니까?

@marcelnem i18n-polyfill과 함께 ngx-translate를 사용할 수 없습니다. i18n-polyfill은 angular-i18n에만 사용할 수 있습니다.

i18n-polyfill의 설정은 실제로 매우 쉬웠습니다. 문서조차 정확하지 않습니다. 무엇을 변경해야 하는지 매우 빠르게 알아냈습니다.

@vekunz 이제 이해했습니다. 감사합니다. i18n-polyfill의 목적이 무엇인지 잘 모르겠습니다. 공식 angular i18n과 마찬가지로 http://myapp/en , http://myapp/de , http://myapp/fr ,... 아래에 앱을 여러 번 빌드하고 여러 번 배포해야 합니까?

@marcelnem 네, i18n-polyfill도 여러 빌드가 필요합니다. 목적은 angular-i18n을 사용하면 현재 html 템플릿 내부에서만 번역을 사용할 수 있고 타이프스크립트 코드 내부에서는 사용할 수 없다는 것입니다. i18n-polyfill은 angular-i18n을 확장하여 타이프스크립트 코드 내부에서도 번역을 사용합니다.
Angular 9(가을 출시 예정)에서는 angular-i18n이 typescript 내부의 번역도 지원하지만 그 동안에는 이를 위해 i18n-polyfill이 필요합니다.

@vekunz 이에 대해 좀 더 자세히 설명할 수 있습니다. "문서가 정확하지 않아도 변경해야 할 사항을 매우 빠르게 알아냈습니다." 나는 아마도 다음 주에 i18n-polyfill을 조사할 것이므로 모든 정보를 높이 평가할 것입니다. 고마워

@halilovicedvin @marcelnem 이 GitHub 문제의 주요 주제가 아니기 때문에 설명하는 pastebin 문서를 만들었습니다. https://pastebin.com/Xib6X6E9

@ocombe xi18n 도구를 사용하여 전체 프로젝트/리포지토리가 아닌 src 폴더(번역 생성용)로만 입력 경로를 제한할 수 있습니까?

@ocombe Ivy는 Angular 8에서 여러 로케일을 지원합니까(언어 파일이 아닌 로케일 정의만, 예를 들어 날짜 파이프용)? 다른 팀은 현재 ngx-translate와 함께 Angular를 사용하지만 한 타사 구성 요소에는 올바른 로캘이 필요하기 때문입니다. 한 가지 옵션은 prod 모드에서 JIT 컴파일러를 사용하는 것이지만 이것은 그다지 좋지 않습니다. 그러나 또한 모든 언어에 대해 새 번들을 컴파일할 수는 없습니다. 이는 너무 많은 작업이 될 것이기 때문입니다.

@vekunz 아니요 여러 로케일을 설정할 수 없습니다. 각 컴파일된 번들에 대한 로케일을 설정해야 합니다(cli 구성 파일에서 설정할 수 있음)
당신이 듣고 싶어 하는 것이 아니라는 걸 알아요, 하지만 지금은 그렇죠

@ocombe 말씀해 주시겠습니까 ? Angular 팀이 문제로 식별하지 않는다는 것을 알고 있지만 가까운 장래에 Angular를 사용하면 앱을 다시 로드하지 않고도 런타임에 언어를 변경할 수 있으므로 번역을 하나의 번들로 올바른 번역을 로드하고 텍스트 리터럴과 바인딩할 수 있습니까?

번들 하나가 있으면 가능하지만 번역은 부스트랩에서 로드됩니다(앱이 로드될 때). 기존 아키텍처를 사용하면 이미 번역을 사용하는 구성 요소를 다시 로드하지 않고 번역을 "핫" 다시 로드하는 것이 매우 복잡합니다.
이것이 불가능하다고 말하는 것은 아니지만 불행히도 가까운 미래에 그런 일이 일어날 것이라고 보지는 않습니다.

빠른 응답에 감사드립니다 @ocombe :) 좋은 일을 계속하십시오 :+1:

@ocombe가 i18n과 Ivy에 대해 이야기한 일부 Angular Conference( AngularConnect 로 생각함)의 프리젠테이션이 있었고 그곳에서 그는 이것이 왜 그렇게 복잡한지에 대해 아주 훌륭하게 설명했습니다. 비디오를 찾으려고 할 수 있습니다.

찾은 것 같아요 https://www.youtube.com/watch?v=miG-ghJhFPc

ivy와 함께 런타임 i18n을 기다리는 사람들을 위해 v9에 대한 현재 계획은 번역이 ivy와 함께 작동하지만 빌드 단계로만 수행되는 것입니다(지금 보기 엔진이 있는 것처럼). 이것은 현재로서는 여전히 1 빌드/로케일이 될 것이고 코드 번역은 없을 것임을 의미합니다(템플릿 번역만).

버머. 글쎄, 가치있는 일에 대해 열심히 일해 주셔서 감사합니다!

@ocombe 런타임 코드 번역을 위해 폴리필을 계속 유지하시겠습니까?

그것이 깨지면 예, 나는 그것에 새로운 것을 추가하지 않을 것입니다.

i18n이 그렇게 오랫동안 2등 시민이었다는 것은 정말 짜증나는 일입니다... 모든 사람이 네이티브 영어 로케일 환경에서 일하는 것은 아닙니다. ):

글쎄요, 저는 Angular를 위한 새롭고 강력한 i18n 솔루션을 개발할 수 있도록 저를 후원해 줄 몇몇 회사를 찾고 있다는 점에 동의합니다(저는 많은 아이디어를 가지고 있습니다).
관심있으신 분들이 생각나시면 트위터(@ocombe)나 이메일([email protected])로 알려주세요 🙂

@ocombe 노고 에도 감사드립니다. 💚 팀을 떠나야 하는 조금 의외의 소식입니다. I had to ... 말씀하신 것처럼 주된 이유가 무엇인지 직접 물어보게 됩니다. 나는 그런 간접적인 암시와 추측을 싫어합니다. 그래서 당신에게 그런 직접적인 질문을 하는 것입니다.

저는 Google의 정규직 직원이 아니라 Angular 팀과 함께 일하는 외부 계약자였습니다. 따라서 팀이 필요로 하는 바에 따라 계약이 언제든지 종료될 수 있습니다.
그들은 프로젝트를 돕기 위해 내부적으로 새로운 사람들을 모집하고 있으며 i18n 및 기타 주제를 도울 적합한 사람들을 찾을 것이라고 확신합니다. 따라서 Angular의 미래에 대해 걱정할 필요가 없습니다 :visage_légèrement_souriant: 그것은 단지 일시적인 좌절

@ocombe 설명 감사합니다.

enums 또는 const 배열 또는 .model.ts 파일과 같은 클래스 외부에서 i18n(i18n-polyfill)을 어떻게 사용할 수 있는지 알려주실 수 있나요?

상수의 경우 여전히 클래스에 넣습니다. 나는 어떤 대안을 모른다 :/

@ocombe ngx-translate, i18npolyfill 및 Angular 팀과 함께 Angular용 i18n을 사용하여 모든 노력에 감사드립니다.
우리는 중요하지 않은 응용 프로그램에서 요구하는 대로 사용자에게 번역을 제공하기 위해 매일 귀하의 작업을 사용합니다.
앞으로 하시는 일에 행운을 빕니다.

상수의 경우 여전히 클래스에 넣습니다. 나는 어떤 대안을 모른다 :/

흠.. 클래스로 옮기면 변수를 정적으로 만들어서 사용해야 합니다. 그러나 i18n을 정적 변수에 사용할 수 없습니다.

내보내기 클래스 예 {
생성자(비공개 i18n: I18n) {}
정적 변수 = i18n('텍스트'); // i18n은 클래스의 정적이 아니므로 여기에서 사용할 수 없습니다.
}

슬픈 소식입니다... 이것은 Angular를 "약화시킵니다"... 다른 사람들이 말하듯이 큰 일을 해준 @ocombe 에게 큰 감사를 드립니다. 행운을 빕니다!

ngx-translate 사용의 단점이 무엇인지 궁금합니다. 사람들이 원하는 기능에 딱 맞는 것 같다.

단점은 다음과 같습니다.

• 번들 크기 증가(외부 lib + 빌드 시 코드를 교체하는 대신 외부 파일로 변환)
• 공식적이지 않음(내가 죽으면 라이브러리가 중단되고 동일한 수준의 지원이 아님)
• xliff/xmb를 지원하지 않습니다(그러나 플러그인을 통해 json 및 기타 형식을 지원하며 이를 지원하는 xliff/xmb 플러그인을 만들 수 있음)
• 번역을 지연 로드/분할할 때 버그가 있는 동작이 있을 수 있습니다(나는 그것을 고칠 수 없음)
• 구문은 공식 구현에 비해 더 복잡합니다.
• 성능(번역의 초기 로드는 텍스트를 1초 동안 사라지게 할 수 있으며 런타임에 내용이 변경되었는지 모니터링해야 하기 때문에 더 많은 메모리 압력)

많은 분들이 이용하시기에 딱 좋은 것 같아요^^

Angular가 접근성을 향상시키고 투자하지만 해당 패키지에 언어를 포함하지 않는 방법이 궁금합니다. 이것은 단일 언어 환경에서 내린 결정이라고 생각합니다.

우리가 일반적으로 3-4개 언어를 상호 교환적으로 제공해야 하는 환경에서 외부 라이브러리를 사용하는 것보다 분명한 이점이 있다는 발표 이후로 이 기능의 릴리스를 참을성 있게 기다려 왔습니다. 이 뉴스를 통해 번역을 완전히 관리하기 위한 전략을 재고해야 합니다.

@ocombe Google이 당신을 계약자로 고용할 가능성은 없나요?😉

@DmitryEfimenko 우리는 현재 ngx-translate 를 사용하고 있으며 매우 만족합니다.

@ocombe Google이 외부 개발자/커뮤니티로부터 이 기능을 수락할 가능성은 무엇입니까? 우리가 너무 오래 기다리는 것 같아요.

당신이 그것에 대해 진지하고 그것에 대해 작업하는 데 시간을 보내고 싶다면 그들이 이 기능에 대해 작업하는 데 도움을 받을 가능성이 높다고 말하고 싶습니다.

당신이 그것에 대해 진지하고 그것에 대해 작업하는 데 시간을 보내고 싶다면 그들이 이 기능에 대해 작업하는 데 도움을 받을 가능성이 높다고 말하고 싶습니다.

@ocombe @IgorMinar Ivy i18n을 위해 자원봉사를 하고 싶은데 기회가 있으면 알려주세요.

당신이 그것에 대해 진지하고 그것에 대해 작업하는 데 시간을 보내고 싶다면 그들이 이 기능에 대해 작업하는 데 도움을 받을 가능성이 높다고 말하고 싶습니다.

기꺼이 기여하고 싶지만 작업의 범위와 복잡성을 전혀 모릅니다. 원본 메시지의 목록을 사양/요구사항으로 사용할 수 있습니까?

아니요, 이 목록은 이제 사용되지 않습니다.
두 분의 관심을 팀에 전달하여 이를 구성하는 방법을 확인할 수 있도록 하겠습니다.

@ocombe 2명 이상인 것 같아요.

Angular 팀에서 필요한 것은

• 요구 사항 목록/일부 사양
• 대략적인 복잡성 추정
• 커뮤니케이션 멘토 1~2명

해당 커뮤니티와 함께 ​​개발을 조직하고 작업을 분할할 수 있습니다.

https://hackmd.io/UfFN_wyVT-Ob1p70nA3N_Q?view 에서 내가 알고 있는 것이 있습니다.

@fetis 작업을 너무 많이 분할하는 것은 좋은 생각이 아닐 수 있습니다. 특히 충돌 가능성이 높은 일부 핵심 작업의 경우 통신 및 컨텍스트 공유에 많은 비용이 듭니다.

여전히 놀란 XLIFF가 프로로 나열됩니다(또는 오히려 ngx-translate에 대한 부족은 단점입니다). Google 번역 및 기타 Google 서비스는 번역 문자열의 JSON 표현인 ARB 파일을 사용하는 것 같습니다. 예를 들어, 우리는 INTL이 ARB 파일로 구현되는 Flutter/Dart로 모바일 앱을 구축했습니다. Angular 팀이 이를 검토할 때 Google 생태계의 다른 항목과 더 나은 상호 운용성을 위해 이것을 고려하면 좋을 것입니다.

작업을 너무 많이 분할하는 것은 좋은 생각이 아닐 수 있습니다. 특히 충돌 가능성이 높은 일부 핵심 작업의 경우 통신 및 컨텍스트 공유에 많은 비용이 듭니다.

동의하지만 이 전체를 한 사람이 합리적인 시간에 전달할 수 없다고 생각합니다. 범위가 너무 큽니다.

작업을 너무 많이 분할하는 것은 좋은 생각이 아닐 수 있습니다. 특히 충돌 가능성이 높은 일부 핵심 작업의 경우 통신 및 컨텍스트 공유에 많은 비용이 듭니다.

동의하지만 이 전체를 한 사람이 합리적인 시간에 전달할 수 없다고 생각합니다. 범위가 너무 큽니다.

@fetis 함께 일할 수 있습니다. 우리는 프로젝트에서 angular i18n을 사용하고 싶지만 매우 제한적입니다.

두 분의 관심을 팀에 전달하여 이를 구성하는 방법을 확인할 수 있도록 하겠습니다.

@ocombe Angular 팀의 피드백이 있습니까?

나는 그들에게 알렸고 그들은 관심이 있는 것 같았지만 외부의 도움을 받기 전에 이 모든 것에 대한 구체적인 계획을 세워야 합니다(그렇지 않으면 필요한 작업을 수행하지 못할 것입니다).
@petebacondarwin 이 지금부터 인수합니다.

@ocombe 안녕하세요. 저는 의견을 살펴보고 있었고 *ngFor에서 사용하는 동안 i18n 태그에 대한 동적 ID를 생성하는 조항이 여전히 없다는 것을 대략적으로 이해했습니다. 다른 옵션이나 해결 방법이 있습니까? 또는 ngx-translate만 사용해야 합니다.

@swapnilvaidankar 해결 방법이 없다고 생각합니다.

@swapnilvaidankar - 이것이 무엇을 의미하는지 설명해 주시겠습니까?

*ngFor에서 사용하는 동안 i18n 태그에 대한 동적 ID 생성

알다시피, 정적 텍스트를 다른 언어로 번역하려면 아래와 같이 HTML 요소 태그에서 i18n 속성을 사용해야 합니다.

<h1 i18n = "Card Header | Title for the under construction card@@constructionheader">Under Construction</h1>

아래와 같이 xlf 파일 스니펫을 생성하고 모든 언어에 대한 대상을 설정할 수 있습니다. 여기에서 프랑스어로 아래와 같이 번역했습니다.

  <trans-unit id="constructionheader" datatype="html">
    <source>Under Construction</source>
    <target>En construction</target>
    <context-group purpose="location">
      <context context-type="sourcefile">src/app/app.component.html</context>
      <context context-type="linenumber">3</context>
    </context-group>
    <note priority="1" from="description"> Title for the under construction card</note>
    <note priority="1" from="meaning">Card Header </note>
  </trans-unit>

하지만 드롭다운 목록의 경우 i18n 속성을 사용하기 어려울 것 같습니다.
예를 들어 명함, 전단지 및 소책자와 같은 제품 목록을 드롭다운 목록이나 단순 목록에 표시하려면 어떻게 동적 ID를 생성할 수 있습니까?따라서 제품 이름을 프랑스어나 다른 언어로 번역할 수 있습니다.

이 방법을 시도했지만,

• 
  {{ 제품 }}
  

아래와 같이 xlf 파일 스니펫을 생성하고 이것을 사용하여 제품 이름을 다음을 사용하여 다른 언어로 번역하는 방법을 잘 모르겠습니다.꼬리표

  <trans-unit id="product" datatype="html">
    <source><x id="INTERPOLATION" equiv-text="{{ product }}"/></source>
    <context-group purpose="location">
      <context context-type="sourcefile">src/app/product/product.component.html</context>
      <context context-type="linenumber">6</context>
    </context-group>
    <note priority="1" from="description"> product name from List</note>
    <note priority="1" from="meaning">product name </note>
  </trans-unit>

여기서 문제는 아이디가 보이면태그는 '제품' 전용입니다. 그러나 제품 목록이 드롭다운 목록으로 제공될 예정이므로 ID가 동적으로 생성되어야 한다고 예상했습니다.

동적 콘텐츠 또는 콘텐츠 목록을 처리할 때마다 이를 달성하는 방법을 잘 모르겠습니다.

자세한 설명 죄송합니다.
여기에서 문제를 이해하셨기를 바랍니다.

감사 해요,
스왑닐

그 문제를 열 ​​수 있습니까? 이것은 여기에서 실제로 주제가 아니며 다른 사람이 동일한 것을 찾고 있다면 더 쉽게 찾을 수 있습니다.

@swapnilvaidankar i18n 속성은 동적 콘텐츠가 아닌 정적 텍스트 번역을 위한 것입니다. 귀하의 예에서 "제품"은 소스 코드에서 가져오고(ts 파일에 정의됨) ngx-translate를 사용해야 하거나(또는 ts 파일에서 직접 번역된 제품 이름이 있음) Http 요청에서 가져옵니다. 그러면 백엔드에서 번역된 제품 이름을 제공해야 합니다.

나는 우리가 그것에 대해 새로운 문제가 필요하다고 생각하지 않습니다. 이미 여러 번 요청한 TS 파일의 런타임 번역 요청일 뿐입니다.

@swapnilvaidankar 옵션 수가 제한되어 있고 이미 알고 있는 경우 텍스트를 렌더링하는 간단한 ngSwitch 로 구성 요소를 만들 수 있습니다. 우리는 이 해결 방법을 사용하고 매력처럼 작동합니다.

@fetis - 문제는 이러한 일반적인 문제가 특정 문제에 대한 토론으로 넘어가는 것이 매우 쉽다는 것입니다. 새 문제를 만들면 이 문제를 방해하지 않고 해당 토론을 계속할 수 있는 새 스레드가 제공됩니다.

@fetis 예, 이 문제는 여러 곳에서 보았지만 적절한 해결책을 찾지 못했습니다. ngSwitch도 발견했지만 제 경우에는 적합한 솔루션이 아닙니다. 그러나 해결 방법에 감사드립니다.

@ocombe 나는 이것을 여기가 아닌 다른 곳에서 논의할 문제로 게시해야 한다고 생각합니다. 👍

응답해 주셔서 감사합니다.

@petebacondarwin @swapnilvaidankar 여기 문제가 있습니다 https://github.com/angular/angular/issues/11405 당신이 찾고 있는
2.0.0-rc.6 이후(!) btw

@ocombe님 , 이 문제가 아직 최신 상태입니까? Angular 9에서 Ivy가 기본값이 될 것 같아서 i18n의 상태가 어떤지 궁금합니다. 생산 준비가 언제쯤 가능할지 예상해 주시겠습니까? Angular 9, 10, 11로? Angular 9와 함께 제공되지 않는 경우 Angular 9(및 Ivy)는 i18n 없이 배송됩니까 아니면 이전 i18n을 사용할 것입니까?

현재 상태에 대한 추가 정보는 이 (https://github.com/angular/angular/issues/11405) 문제에서 찾을 수 있습니다. 현재 상태에 대해 이 호에서 읽을 가치가 있는 설명:

• https://github.com/angular/angular/issues/16477#issuecomment -512290696
• https://github.com/angular/angular/issues/16477#issuecomment -506378004
• https://github.com/angular/angular/issues/16477#issuecomment -512548506

또한 이것은 확인할 가치가 있습니다.

v9에서 스위치를 전환하여 기본값이 ivy를 사용하도록 하고 있지만 완전히 작동하지 않는 여러 시나리오가 있을 수 있으며 해당 프로젝트는 현재 보기 엔진을 고수할 것으로 예상합니다.
우리는 v9.0.0 릴리스를 위해 i18n을 시작하고 실행하기 위해 노력하고 있지만 빡빡할 것입니다.

"런타임 i18n(모든 로케일에 대한 하나의 번들)"의 현재 상태는 무엇입니까?

@Ivajkin - 이 문제가 최신 상태로 유지되지 않아 유감입니다.

"런타임 i18n"은 일반적으로 요구되는 기능이지만 사람에 따라 의미가 다를 수 있습니다.
새로운 i18n $localize 접근 방식에서는 런타임에 실제 번역을 수행할 수 있습니다.

Angular 애플리케이션 부트스트랩 전에 가능한 모든 메시지를 번역하지 않는 경우 런타임은 실제로 다소 복잡할 수 있습니다. 이 작업을 수행하는 경우 컴파일 시간 변환에 대한 새로운 접근 방식이 필요한 것일 수 있습니다.

새로운 i18n에서 번역은 Angular 컴파일러가 아니라 빌드 파이프라인의 맨 끝에서 발생합니다. 즉, 라이브러리 등에서 번역되지 않은 메시지를 제공할 수 있어야 하며 최종 애플리케이션을 빌드할 때만 번역을 수행할 수 있어야 합니다.

이것은 모두 v9.0.0에서 작업 중입니다.

https://github.com/angular/angular/tree/master/packages/localize 에서 우리의 위치를 ​​확인하세요.

@petebacondarwin 새로운 컴파일 시간 번역에 대해 조금 더 자세히 설명해 주시겠습니까? 이를 통해 모든 로케일에서 작동하는 단일 번들(AOT 포함)을 구축할 수 있습니까?

새로운 접근 방식에서는 Angular 컴파일러 내에서 번역을 수행하는 대신 전역 $localize 템플릿 문자열 태그 핸들러 를 통해 번역해야 하는 메시지에 "태그"를 지정합니다. 이러한 태그가 지정된 문자열은 번들링 및 축소의 모든 방식을 유지하므로 빌드 파이프라인이 끝날 때 여전히 존재하고 검색할 수 있습니다. 이 파일은 다른 팀의 응용 프로그램에 포함하기 위해 보내는 라이브러리의 번들일 수 있습니다!

이제 몇 가지 옵션이 있습니다.

a) 이러한 태그가 지정된 메시지를 정적으로 식별하고 번역으로 대체하는 도구를 실행합니다. 이렇게 하면 JavaScript에서 $localize 참조가 효과적으로 제거되고 배포를 위한 최소한의 코드 번들만 남게 됩니다. 이 "컴파일 타임 인라이닝" 도구는 여러 번역을 수행하고 번역하는 각 언어에 대한 번들 사본을 생성할 수 있습니다. 빌드 파이프라인의 맨 끝에서 실행할 수 있으므로 지원하는 모든 언어에 대해 빌드의 다른 측면을 실행할 필요가 없습니다.

b) $localize 태그가 브라우저에서 실행되는 코드에서 끝나도록 허용하고 $# $localize 구현을 사용하여 런타임에 메시지를 번역합니다. 이 접근 방식의 단점은 $localize 호출은 물론 $localize 번역 구현도 포함해야 하기 때문에 브라우저에 대한 페이로드가 더 크다는 것입니다. 또한 번역 자체를 브라우저로 보내야 합니다. 이 접근 방식의 한 가지 이점은 런타임에 번역의 지연 로드를 지원하는 것일 수 있습니다. 그러나 http 서버(또는 빌드 서버)에서 번역을 수행하는 것이 런타임 경험을 보다 효율적으로 만든다는 점은 논란의 여지가 있습니다.

런타임 옵션 b) 부탁드립니다. 번역을 JSON 파일로 로드하고 현재 ngx-translate 와 같이 런타임에 언어를 전환할 수 있습니다.

설명 감사합니다. a) 접근 방식이 "각도"에 더 가깝지만 b) 접근 방식(일반적으로 지연 로딩)의 가장 큰 장점은 사용자가 번역을 동적으로 정의/변경하는 기능도 있다는 것을 이해합니다(앱에 대한 수정된 번역을 즉시 사용할 수 있음). . 내가 그것을 올바르게 이해한다면 접근 방식 a)의 번역에 약간의 변화가 있어도 새로운 재구축을 의미합니다.

이것은 미리 정의된 Angular 구성 요소가 있는 정적으로 생성된 페이지에서 사용자가 원하는 대로 프로그래머가 정의한 각도 구성 요소를 포함하는 사용자 생성 템플릿으로 전환하는 것과 동일한 이점입니다(이 방법으로 정의된 템플릿은 데이터베이스에서도 로드됩니다... )

로드할 때 기본적으로 a) 접근 방식이 사용될 가능성에 대해서도 생각해 보았을 것입니다. 런타임 번역 요청이 발생하면(예: 백엔드가 최신 번역을 보내기 시작함) 표시된 블록(지금까지 정적 텍스트 포함)이 크롤링을 시작하고 b) 접근 방식과 같이 동적으로 교체됩니다. 따라서 b)는 필요한 경우에만 활성화되고 모든 번역 가능한 부분은 절차)에 따라 준비됩니다. 그러한 접근 방식이 b) 접근 방식 자체보다 더 부담이 될 것이며 이러한 방식으로 직접적으로 실현 가능하지 않다는 것을 이해하지만 이것이 사용자의 실제 요구에 더 가깝습니다.

나열한 옵션에 대해 특정 경우에 이러한 동적 기능을 달성하기 위해 응용 프로그램 성능의 약 25%를 희생할 용의가 있습니다(물론 이 동적 접근 방식을 모든 곳에서 사용하지는 않을 것입니다). 따라서 AOT 현지화 템플릿이 0.4초 만에 렌더링되고 동적 템플릿의 경우 0.5초 만에 생성된 경우 번역 변경에 대한 즉각적인 응답이 필요한 앱에서 여전히 허용 가능한 것으로 간주합니다.

@demisx 두 접근 방식 모두 v9에서 사용할 수 있지만 옵션 a)만 처음에는 완전히 지원되며(역호환성을 위해) Angular 팀에서 완전히 승인되기 전에 옵션 b)에 대해 새로운 것이 개발될 수 있습니다.
내 라이브러리 Locl 는 Angular 팀이 그 격차를 메울 때까지 v9가 릴리스될 때 옵션 b)에 대한 몇 가지 도우미를 제공하여 누구나 사용할 수 있습니다.

이러한 런타임 번역은 구성 요소가 렌더링되면 새 번역이 로드된 경우에도 동적으로 텍스트를 변경할 수 없다는 점에서 "반응적"이 아닙니다.

번역된 메시지는 $localize 태그 문자열과 관련하여 정적입니다. 따라서 구성 요소를 다시 렌더링해야 합니다. 그리고 IVY의 템플릿 캐싱에 따라 다시 렌더링하는 것만으로는 충분하지 않을 수 있습니다.

이것이 런타임 번역의 동작이 반드시 직관적이지는 않기 때문에 구현하기 까다로운 이유 중 하나입니다.

빌드에서 정적 번역으로 시작한 다음 나중에 런타임 번역을 추가하는 하이브리드 접근 방식과 관련하여. 컴파일 타임 인라이닝이 $localize 태그를 제거하지 않고 템플릿 문자열 리터럴 부분만 업데이트한 경우 가능합니다. 그러나 이것은 컴파일 시간 비용과 추가 번들 크기 비용을 초래합니다.

Angular 9 RC1에서 ng xi18n 를 실행하면 "죄송합니다. 그러나 i18n은 아직 Ivy에서 구현되지 않았습니다."를 반환하지만 변경 로그는 현재 구현된 _some_ i18n 지원이 있음을 나타냅니다. 지금은 번역 파일을 수동으로 업데이트해야 합니까?

@neil-119 현재 아이비 모드에서는 추출이 지원되지 않습니다. 추출을 실행하려면 여전히 ivy를 비활성화해야 합니다. 그러나 추출된 번역 파일을 사용하도록 다시 활성화할 수 있습니다.

최종 v9 릴리스에 추출을 포함하도록 계획되기를 바랍니다.

@neil-119 Angular CLI는 추출을 위해 자동으로 VE를 사용해야 합니다. 작동하려면 아무 것도 할 필요가 없습니다. 우리는 또한 그것을 테스트하므로 그것이 깨졌다는 것에 놀랐습니다. 재현으로 문제를 열 ​​수 있습니까?

현재 아이비 모드에서는 추출이 지원되지 않습니다.

또는 아니요, 그것은 쇼 스토퍼입니다. 현재 문자열 추출을 사용하는 자동화된 프로세스가 있습니다. 번역을 자동으로 추출할 수 없다면 어떻게 Ivy로 마이그레이션할 수 있습니까?
sconfig.json every time 조작? 이것은 나에게 좋지 않은 것 같습니다.

@fetis - 제가 틀렸습니다. CLI를 사용하는 경우 ivy가 활성화된 경우에도 ng xi18n 를 호출하면 예상대로 작동해야 합니다.

@petebacondarwin 감사합니다. 현재 프로젝트에서 Ivy를 시험해 볼 예정이므로 곧 확인할 수 있기를 바랍니다.

안녕하세요, 내 구성 요소 (각도 9.0.0-rc.1)에서 사용하려고했습니다.

$localize `some string to localize`;

@angular/localize/init의 소스 코드에서 문서로 찾았습니다.

내 언어에 대해 평소와 같이 빌드하려고 하면 이 오류가 발생합니다.
No translation found for "4145296873012977836" ("some string to localize").

해당 문자열에 대한 번역을 제공하려면 어떻게 해야 합니까?
내가 기대하는 것은 ng xi18n이 구성 요소 코드에서 이 텍스트와 함께 .xlf 파일을 생성한다는 것입니다. 맞습니까 아니면 제가 뭔가를 놓치고 있습니까?

안녕하세요 @Ks89 - 애플리케이션 코드(템플릿이 아닌)에서 메시지 추출은 v9에서 지원되지 않습니다.
그러나 교활한 경우 해결할 수 있습니다. 4145296873012977836 는 메시지의 ID이므로 이 ID로 번역 파일에 번역을 제공하면 번역할 때 사용됩니다.

@petebacondarwin 이 기능이 Angular에 언제 추가되나요?
컴포넌트에서 런타임 번역을 정말 유용하게 만드는 것이 정말 중요하다고 생각합니다.

.xlf 파일을 번역가에게 보낼 때 모든 문자열을 빠르게 추가한 다음 그 결과를 앱에 매우 쉽게 적용할 것으로 기대합니다.

답변 해주셔서 감사합니다

9.1에서 기대하겠습니다

ChangeDetectionStrategy 가 모든 구성 요소에 대해 무엇이든 상관없이 전체 앱을 강제로 다시 렌더링하는 방법이 있다면 이러한 동적 문제를 해결하기가 너무 쉽습니다.

@petebacondarwin Angular 9는 이제 새로운 $localize 태그 기능과 함께 출시되지만 메시지 추출 기능은 없습니다. 이전에 Angular 9.1에서 이를 기대할 수 있다고 말했습니다. 이 예측이 여전히 유효하며 $localize API가 안정적일 것으로 기대할 수 있습니까?

템플릿에서 번역을 추출할 수 있습니다.
코드에서도 $localize 를 사용하려면 Locl을 살펴봐야 합니다. https://github.com/loclapp/locl/
@locl/cli 를 사용하면 코드 및 템플릿에서 추출할 수 있습니다.

@vekunz - 예측은 여전히 ​​유효합니다. 또한 @ocombe가 지적했듯이 현재 CLI 번역 추출 메커니즘은 Angular 템플릿(예: i18n 태그로 표시된 항목) 내에 있는 모든 번역에 대해 잘 작동합니다. 지금 핵심 도구를 사용하여 추출할 수 없는 유일한 것은 자신의 코드(예: 서비스 또는 구성 요소) 내에서 $localize 에 대한 호출입니다.

$localize 호출 자체는 안정적인 API입니다.

번역 및 추출(특히 컴파일 시)을 수행하는 도구는 여전히 비공개입니다. 그러나 이것은 주변에 자신만의 도구를 만들 계획이 아니라면(예: @ocombe 가 Locl에서 하는 것처럼) 문제가 되지 않습니다.

@petebacondarwin 에게 감사드립니다. 이를 통해 코드의 텍스트를 추출을 위해 "숨겨진" 구성 요소 템플릿으로 복제할 수 있습니다. 그러면 추출과 번역이 모두 작동해야 하지 않겠습니까?

@ocombe 추출이 Angular 9.1에서 작동한다는 예측에 따라 우리 관리자는 솔루션 비용을 지불하지 않을 것입니다. 특히 언어 및 번역된 경로의 실시간 전환이 필요하지 않기 때문입니다.

추출을 위해 코드의 텍스트를 "숨겨진" 구성 요소 템플릿으로 복제할 수 있습니다.

예, 이 해결 방법은 현재로서는 작동합니다.

혼란스럽습니다. 9.1에서도 런타임 번역이 가능합니까? 아니면 템플릿 외부에서 추출만 하시겠습니까? 아니면 이들 중 아무 것도?

저에게 런타임 번역은 킬러 기능이 될 것입니다. 여러 번들을 배포하고 사용자가 전체 페이지를 강제로 다시 로드하도록 하는 것은 사용성이 좋지 않다고 생각합니다.

@JustDoItSascha
런타임 번역을 보여주는 간단한 데모를 만들었습니다.
https://stackblitz.com/edit/ivy-vjqzd9?file=src%2Fapp%2Fapp.component.ts

안녕! JavaScript가 가져오기를 구문 분석하는 동안 문자열이 번역되기 때문에 main.ts에서 loadTranslations 를 호출하려고 하지만 충분하지 않습니다.

main.ts는 AppComponent를 가져오는 AppModule을 가져옵니다(여기서 $localize 사용).

작동하게하려면 다음을 수행하십시오.

loadTranslations(......);
import('./app/app.module').then(m => platformBrowserDynamic(). bootstrapModule(m.AppModule);

이제 이것은 작동하지만 Angular의 "complier.js" 번들이 공급업체 번들에 포함되도록 합니다.

그것을 피할 방법이 있습니까? 감사 해요

현재 loadTranslations 는 애플리케이션이 시작되기 전에 호출되어야 하므로 polyfills.ts 에서 수행할 수 있습니다. 그리고 다른 번역 세트를 로드하려면 페이지를 다시 로드해야 합니다. 그 이유를 조금 더 알고 싶다면 https://blog.ninja-squad.com/2019/12/10/angular-localize/ 를 작성하여 설명했습니다.

현재 loadTranslations 는 애플리케이션이 시작되기 전에 호출되어야 하므로 polyfills.ts 에서 수행할 수 있습니다.

그보다 더 나쁜 것은 모듈 파일을 가져오기 전에 호출해야 하기 때문에 polyfills.ts(메인 앱 파일보다 먼저 실행됨)에 넣으면 작동하지만 앱에서 사용하려는 경우 "main" 파일을 사용하려면 모듈에 대해 동적 import(...) 를 사용해야 합니다.

@vekunz 지금은 내 lib를 사용하지 않는 좋은 이유입니다 😊 Locl은 추출에 관한 것이 아니라 i18n을 단순화하기 위해 다른 많은 도구를 추가할 생각입니다.

Angular에서 런타임 i18n을 구현할 의도가 있습니까? 우리는 거의 3년 동안 이 기능을 기대해 왔으며 이제 Ivy가 여기에 있으며 아직 반쯤 구워진 상태입니다.

Angular에서 런타임 i18n을 구현할 의도가 있습니까? 우리는 거의 3년 동안 이 기능을 기대해 왔으며 이제 Ivy가 여기에 있으며 아직 반쯤 구워진 상태입니다.

제가 이해하는 바는 Ivy가 여러 면에서 미래를 가능하게 하는 원동력이라는 것입니다. i18n 바늘이 Ivy 출시와 함께 엄청나게 움직인 것은 놀라운 일이 아니지만, 앞으로의 큰 변화에 대한 잠재력을 불러일으킬 것입니다. 그것이 내가 읽은 것이었고, 어쨌든 나의 희망이었습니다.

@Karasuni - 런타임 번역이 핵심 Angular 프레임워크에 대해 실제로 의미하는 바가 무엇인지 명확히 해야 한다고 생각합니다. 왜냐하면 그것에 대해 상당한 혼란이 있기 때문입니다.

v9에 대한 변경 사항에는 $localize 기반 번역이 포함됩니다. 이것의 주요 목표는 Angular 컴파일러에서 번역을 분리하여 여러 가지 멋진 개선 사항을 가능하게 하는 것입니다.

v9의 모든 사용자가 즉시 사용할 수 있는 첫 번째 기능은 번역된 애플리케이션의 생성 속도를 높이는 것입니다. 이전에는 앱을 번역하려는 각 언어에 대해 전체 빌드 파이프라인을 실행해야 했습니다. 이제 애플리케이션의 기본 컴파일은 하나만 실행하면 되며 빌드 출력에서 ​​각 언어에 대해 훨씬 더 짧은 최종 번역 프로세스가 실행됩니다. 이를 지원하기 위해 새로운 @angular/localize 패키지, Angular 컴파일러 내부의 변경 사항 및 Angular CLI 내부의 전체 작업 부하를 통해 이를 최대한 매끄럽고 투명하게 만듭니다.

둘째, $localize 태그가 분산 코드에 남을 수 있으므로 이제 브라우저에서 번역을 수행할 수도 있습니다(컴파일 시간이 아닌 런타임에). 이것이 핵심 Angular 프레임워크에서 런타임 번역으로 의미하는 것입니다. 그러나 이것의 최종 결과는 컴파일 타임의 번역과 사실상 동일하지 않습니다. 번역은 한 번만 발생합니다. 런타임에 언어를 변경하려면 전체 애플리케이션을 다시 시작해야 합니다(예: 다시 로드를 통해). 이것은 프로젝트가 수많은 번역 파일과 함께 단일 배포판을 배포할 수 있도록 하는 이점이 있습니다. 이는 모든 다른 번역을 미리 생성하고 싶지 않은 소수의 사용 사례에서 유용합니다. @ocombe 와 다른 사람들이 여기에서 지적한 것처럼 번역을 일찍 로드하는 것과 관련된 몇 가지 까다로운 문제가 있습니다. 이를 수행하는 데 더 많은 도움이 필요하면 https://www.locl.app/ 를 고려할 수 있습니다.

이 "런타임" 번역은 지연 로드 경로에도 사용할 수 있으므로 설정 방법에 따라 다른 언어로 다른 경로를 가질 수 있습니다.

모든 시나리오에서 작동하는 이 번역 로드에 대한 단일 접근 방식이 없기 때문에 이를 CLI에 적용하지 않았거나 아직 이를 지원하기 위한 안정적인 공개 API를 제공하지 않았습니다. 사용 사례를 더 잘 이해하면 이에 대한 지원을 더 추가할 수 있습니다. 그 동안 Locl과 같은 것이 스스로 해결하는 모험을 하고 싶지 않다면 도움이 될 수 있습니다.

마지막으로 런타임 시 번역된 문자열의 동적 변경은 코어 Angular 프레임워크에서 특별히 (설계상) 지원되지 않습니다. 번역된 문자열을 Angular의 변경 감지 시스템에 연결하면 대부분의 애플리케이션에 너무 많은 부담을 주고 성능을 저하시킵니다. 커뮤니티와의 상호 작용에서 언어 변경 시 애플리케이션을 다시 시작하는 것 이상으로 실제로 필요한 실제 시나리오를 거의 본 적이 없습니다. 이것이 애플리케이션의 요구 사항인 경우 번역을 가져오는 템플릿의 문자열에 사용자 정의 내장 파이프를 사용하여 이를 달성할 수 있으며 번역을 위해 즉석에서 $localize 를 호출할 수도 있지만 다음과 같이 보이지는 않습니다. 이것은 매우 성능이 좋을 것입니다. 그렇지 않으면 https://netbasal.gitbook.io/transloco/와 같은 보다 동적인 접근 방식을 고려할 수 있습니다.

Angular의 다음 마이너 버전에서 제공되는 주요 변경 사항은 TS 코드에서 현지화된 문자열을 식별하고 추출할 수 있는 향상된 번역 추출이 될 것입니다. 현재 CLI 추출은 템플릿의 현지화된 문자열만 처리합니다.

위에서 설명한 대로 런타임 번역을 개선하기 위한 변경 사항은 빠르면 9.1 이후에 나타날 것입니다.

마지막으로 런타임 시 번역된 문자열의 동적 변경은 코어 Angular 프레임워크에서 특별히 (설계상) 지원되지 않습니다. 번역된 문자열을 Angular의 변경 감지 시스템에 연결하면 대부분의 애플리케이션에 너무 많은 부담을 주고 성능을 저하시킵니다. 커뮤니티와의 상호 작용에서 언어 변경 시 애플리케이션을 다시 시작하는 것 이상으로 실제로 필요한 실제 시나리오를 거의 본 적이 없습니다.

내가 틀렸을 수도 있지만 이 스레드만 해도 많은 사람들이 애플리케이션을 다시 빌드하거나 다시 로드하지 않고도 런타임에 언어를 실시간으로 변경할 수 있는 기능에 분명히 관심을 보였습니다. 아니면 여기 있는 모든 사람들이 runtime translation 에 대해 다른 정의를 가지고 있습니까?

언어를 전환하기 위해 애플리케이션을 다시 로드하고 싶지 않습니다. 예를 들어 사용자가 양식이 있는 페이지에 있을 때 번역 전환에 대한 전체 페이지 새로고침은 사용자에게 거슬릴 것입니다.

그냥 명확하게. 내가 말하려는 것은 많은 사람들이 응용 프로그램에서 실제 언어 변경이 절대적으로 필요하다고 말하기 위해 나에게 다가왔다는 것입니다. 그러나 원인을 파헤쳐보면 그렇지 않다는 것을 알 수 있습니다. 이를 필요로 하는 시나리오가 없다고 말하는 것은 아니지만 지난 1년 동안의 경험에 따르면 극히 일부를 접했습니다.

질문: 사용자가 앱의 특정 양식으로 이동할 때 언어를 전환해야 하는 이유는 무엇입니까?

라이브 스위칭도 필요하다고 생각하지 않습니다. 얼마나 자주 웹사이트의 언어를 변경합니까? 일반적으로 최대 한 번. 그리고 이번에는 페이지 새로고침이 그렇게 중요하지 않습니다. @petebacondarwin 이 말했듯이 라이브 스위칭에 대한 거의 모든 시나리오는 실제 시나리오와 관련이 없지만 "있으면 좋은" 것입니다.

아니면 여기 있는 모든 사람들이 런타임 번역에 대해 다른 정의를 가지고 있습니까?

런타임 번역이 절대적으로 필요합니다. 고객은 빌드 서버뿐만 아니라 현장에서 번역을 편집하고 업데이트할 수 있어야 합니다. 따라서 컴파일 시간과 반대되는 런타임입니다.

페이지 로드 후 언어의 실제 전환은 있으면 좋습니다.

그냥 명확하게. 내가 말하려는 것은 많은 사람들이 응용 프로그램에서 실제 언어 변경이 절대적으로 필요하다고 말하기 위해 나에게 다가왔다는 것입니다. 그러나 원인을 파헤쳐보면 그렇지 않다는 것을 알 수 있습니다. 이를 필요로 하는 시나리오가 없다고 말하는 것은 아니지만 지난 1년 동안의 경험에 따르면 극히 일부를 접했습니다.

질문: 사용자가 앱의 특정 양식으로 이동할 때 언어를 전환해야 하는 이유는 무엇입니까?

그것이 확실한 요구 사항이 아니라는 것이 옳을 수도 있습니다. 로드 시 번역을 배포하려고 시도할 수 있지만 현재 외부 라이브러리를 사용하여 다시 로드하거나 페이지의 위치를 ​​변경하지 않고 언어를 동적으로 전환할 수 있는 응용 프로그램의 사용자 경험을 완전히 변환합니다. 번역은 오랫동안 뜨거운 주제였습니다.

중요한 질문이 있습니다. 번역 파일을 비동기식으로 로드할 수 있습니까? 내 모든 번역은 다시 작성하지 않고 업데이트할 수 있는 것이 중요하기 때문에 데이터베이스에 저장됩니다.

예, 비동기식으로 로드할 수 있지만 로드될 때까지 애플리케이션 시작을 지연해야 합니다.

그냥 명확하게. 내가 말하려는 것은 많은 사람들이 응용 프로그램에서 실제 언어 변경이 절대적으로 필요하다고 말하기 위해 나에게 다가왔다는 것입니다. 그러나 원인을 파헤쳐보면 그렇지 않다는 것을 알 수 있습니다. 이를 필요로 하는 시나리오가 없다고 말하는 것은 아니지만 지난 1년 동안의 경험에 따르면 극히 일부를 접했습니다.
질문: 사용자가 앱의 특정 양식으로 이동할 때 언어를 전환해야 하는 이유는 무엇입니까?

그것이 확실한 요구 사항이 아니라는 것이 옳을 수도 있습니다. 로드 시 번역을 배포하려고 시도할 수 있지만 현재 외부 라이브러리를 사용하여 다시 로드하거나 페이지의 위치를 ​​변경하지 않고 언어를 동적으로 전환할 수 있는 응용 프로그램의 사용자 경험을 완전히 변환합니다. 번역은 오랫동안 뜨거운 주제였습니다.

기술적으로 전체 앱을 다시 로드하면서도 사용자가 있던 위치를 계속 유지할 수 있습니다.
어딘가에 저장되고 시작 시 검색되는 상태 기반 앱(ngxs, ngrx 또는 기타 상태 관리 라이브러리 포함)이 "그냥" 필요합니다.

유일한 트릭은 스크롤 위치를 유지하는 것이지만 그것도 가능합니다.

@petebacondarwin 나는 당신에게 동의한다고 말해야합니다. 나는 앱을 사용할 때 언어 간에 영구적으로 앱을 전환하는 실제 최종 사용자(개발 단계의 테스터 제외)를 모릅니다. 물론 어떻게든 다른 곳에서 열면 처음에는 그렇게 하겠지만 나중에는 드문 경우입니다.

아니면 여기 있는 모든 사람들이 런타임 번역에 대해 다른 정의를 가지고 있습니까?

런타임 번역이 절대적으로 필요합니다. 고객은 빌드 서버뿐만 아니라 현장에서 번역을 편집하고 업데이트할 수 있어야 합니다. 따라서 컴파일 시간과 반대되는 런타임입니다.

페이지 로드 후 언어의 실제 전환은 있으면 좋습니다.

고객이 무엇을 하고 있는지 잘 모르겠지만 "프로덕션 웹사이트에서 실시간으로 번역을 편집하는 것"은 일반적인 시나리오처럼 들리지 않습니다.

라이브 언어 변경(_페이지 새로고침 없이_)이 그런 거래 차단기라고 생각하지 않습니다.
사용자의 언어 변경은 한 번만 발생합니다.

생각해 보세요. 전화 언어를 몇 번이나 바꾸셨습니까? 아마도 한 번 또는 방금 기본 언어로 롤링했을 것입니다.

페이지를 다시 로드하지 않고 실시간 변경을 수행하기 위해 언어 변경을 관찰하는 것은 사용자의 평생 동안 거의 사용되지 않는 것에 대해 많은 성능 저하를 가져옵니다.

궁극적으로 인은 나를 위해 3가지로 귀결됩니다.

1. 템플릿 및 TS 파일에서 번역을 추출합니다.
   
   
   
   • 소스 언어 자산을 업데이트합니다.
   
   
   • 번역도 업데이트합니다(_여러 언어가 있는 경우 fr, en, de... 모든 언어가 새 번역 키로 업데이트되고 제거된 번역 키로 업데이트되기를 원합니다._)
   
   
2. 모든 번역에 대해 하나의 빌드(_각 번역에 대해 1개의 빌드를 갖는 것도 빌드 시간을 여러 번 하지 않는 한 괜찮습니다._)
3. 사용 가능한 언어를 가져오고 다시 로드하여 언어를 변경합니다.

@카라수니
번역을 비동기식으로 가져온 다음에만 Angular 앱을 로드할 수 있습니다.
import(...) 를 사용하여 app.module을 비동기식으로 로드하는 방법에 대한 위의 내 의견을 참조하십시오.

개인적으로 나는 Wikipedia를 사용하여 내가 아는 영화의 제목이 다른 언어로 "번역된" 것을 알아냅니다.

이 시대에는 이중 언어 또는 삼중 언어를 구사하는 것이 일반적입니다(미국 내에서 제외하고는 아무런 해가 없음).

사용자가 라이브 스위치 언어를 원할 수도 있습니다. 완전히 그럴듯합니다. Wikipedia 예제는 이것을 활성화한 긍정적인 결과입니다. 성능을 구실로 다른 잠재적인 용도가 살아 있기 전에 우리가 왜 그것을 억제해야 하는지 모르겠습니다.

"저조한 번역 성능"의 여러분에게 같은 예가 되어야 하는 ocombe의 ngx-translate조차도 일상적인 사용자에게 충분히 빠르게 실행되었습니다.

저는 개인적으로 3개 국어를 구사하며 한 가지 언어를 사용하는 데 정착할 수 없습니다. 모든 언어가 제게는 아름답습니다.

나는 이것에 동의할 수 없다고 말했다.

생각해 보세요. 전화 언어를 몇 번이나 바꾸셨습니까? 아마도 한 번 또는 방금 기본 언어로 롤링했을 것입니다.

Wikipedia는 기사의 다른 언어가 실제로 독립적인 기사이기 때문에 최악의 예입니다. 일반적으로 정확히 동일한 사이트의 다른 언어는 필요하지 않습니다. 4개국어를 구사하더라도.
그리고 실제로 라이브 전환이 필요한 경우 @petebacondarwin 이 언급한 사용자 지정 번역 파이프 또는 @ocombe의 새 도구를 사용하여 해결 방법을 사용할 수 있습니다.

좋습니다. 저는 이것이 이 토론을 하기에 가장 좋은 장소가 아니라고 생각합니다. (지금까지는 모두 매우 합리적이었지만) 우리가 부정적인 논의에 빠져들지 않을까 걱정됩니다. 가까운 장래에 Angular 프레임워크가 즉시 사용 가능한 언어 전환 솔루션을 제공하지 않을 것입니다.

나는 이 문제의 가치가 그 과정을 밟았다고 생각합니다. 이 문제에 대한 설명에 링크된 미해결 문제 및 PR을 https://github.com/angular/angular/milestone/101 로 이동했으며 이 PR을 닫고 잠글 예정입니다.

기능 요청에 대한 새로운 문제가 있는 경우 새 문제를 열고 저를 태그하십시오.