内部化 Angular 10 @angular/localize，$localize 不起作用

Question

I upgraded from Angular 8 to 10th version, now implementing i18n with built in module @angular/localize , everything is great, except I can't translate source code, as per guides I have to use $localize function in order to translate code in 'controller', in guides saying that after I use this function it should show me a warning with ID , so I need to add it in translation file, but it's not showing.

Below is example I tried to add.

test = $localize`:meaning|description@@introductionHeader:text`;

I used several options, added custom ID, added to translation file manually information(info about line and file), but it's still not working.

<trans-unit id="introductionHeader" datatype="html">
    <source>text</source>
    <target>Translation here</target>
    <context-group purpose="location">
        <context context-type="sourcefile">*******.ts</context>
        <context context-type="linenumber">31</context>
    </context-group>
</trans-unit> 

Does anyone know what can cause this problem, or maybe work around or alternatives ways, how I can add translation in code?

Answer 1

If you simply use "ng build" you need to have proper angular.json configuration:

"architect": {
        "build": {
          "options": {
            "localize": true,
            "aot": true,
        }
}

and other settings from here: https://angular.io/guide/i18n#localize-config