Angular v12.2.7への変更点と変更箇所

# Angular v12.2.7への変更点と変更箇所

[Release 12.2.7](https://github.com/angular/angular/releases/tag/12.2.7)
[確認しているレポ](https://github.com/Ntakuya/angular)

Checks

- [ done ] titlecase pipe incorrectly handling numbers (#43476)
- [ done ] include leading whitespace in source-spans of i18n messages (#43132)
- [ not check ] handle directives that refer to a namespaced class in a type parameter bound (#43511)
- [ ] improve error message for missing animation trigger (#41356)

## to v12.2.7 from v12.2.6

### TitleCase Pipe Handling Number

数字が入ってる際にtitle caseを利用した際に思わぬ結果が返ってきたものを、数字の後ろを全て大文字化するように対応を変更している.(これはこれで正解なのか...)

[fix(common): titlecase pipe incorrectly handling numbers](https://github.com/angular/angular/pull/43476)

```my-app.component.ts
import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `{{ '1st 2nd 3rd' | titlecase }}`,
  styleUrls: ['./app.component.css'],
})
export class AppComponent {}
```

#### Compare Views

![スクリーンショット 2021-09-23 16.55.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/144543/e165b32a-fe19-cf78-c45a-d1eb8c89a20b.png)


## Compiler lex interpolations 2

`ng extract-i18n`の結果、作成された際のsourceファイルが変更される。
n18i利用しているので、違った場合は指摘していただけると助かります。

あとで、ちゃんと内部のCode読む。

```my-app.component.html
<div i18n-title title="Some &amp; attribute"></div>
<div i18n>Some &amp; message</div>
<div i18n-title title="Some &amp; {{ 'interpolated' }} attribute"></div>
<div i18n>Some &amp; {{ "interpolated" }} message</div>
<div i18n>&amp;</div>
<div i18n>&amp;&quot;</div>
<div i18n-title title='"'></div>
<div i18n-title title='""'></div>

<div i18n>Interpolation: {{ one }}&nbsp;Interpolation: {{ two }}</div>

```

### Compare View

```(12.2.6)messages.xlf
<?xml version="1.0" encoding="UTF-8" ?>
<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
  <file source-language="en-US" datatype="plaintext" original="ng2.template">
    <body>
      <trans-unit id="2908931752694090721" datatype="html">
        <source>Some &amp; attribute</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">1</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4700340487900776701" datatype="html">
        <source>Some &amp; message</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">2</context>
        </context-group>
      </trans-unit>
      <trans-unit id="2192507241536331751" datatype="html">
        <source>Some &amp; <x id="INTERPOLATION" equiv-text="mp; {{ &apos;interpolated"/> attribute</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">3</context>
        </context-group>
      </trans-unit>
      <trans-unit id="5504137555058910768" datatype="html">
        <source>Some &amp; <x id="INTERPOLATION" equiv-text="mp; {{ &quot;interpolated"/> message</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">4</context>
        </context-group>
      </trans-unit>
      <trans-unit id="2406634758623728945" datatype="html">
        <source>&amp;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">5</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4156372478368653226" datatype="html">
        <source>&amp;&quot;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">6</context>
        </context-group>
      </trans-unit>
      <trans-unit id="2720535395337591908" datatype="html">
        <source>&quot;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">7</context>
        </context-group>
      </trans-unit>
      <trans-unit id="3600934704948217447" datatype="html">
        <source>&quot;&quot;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">8</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4906579891802234912" datatype="html">
        <source>Interpolation: <x id="INTERPOLATION" equiv-text="{{ one }}"/> Interpolation: <x id="INTERPOLATION_1" equiv-text="ion: {{ t"/></source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">10</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4150330030790364157" datatype="html">
        <source>Hello i18n!</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/layouts/ng18i-layout/ng18i-layout.component.html</context>
          <context context-type="linenumber">1</context>
        </context-group>
        <note priority="1" from="description">An introduction header for this sample</note>
      </trans-unit>
    </body>
  </file>
</xliff>

```

```(12.2.7)messages.xlf
<?xml version="1.0" encoding="UTF-8" ?>
<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
  <file source-language="en-US" datatype="plaintext" original="ng2.template">
    <body>
      <trans-unit id="2908931752694090721" datatype="html">
        <source>Some &amp; attribute</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">1</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4700340487900776701" datatype="html">
        <source>Some &amp; message</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">2</context>
        </context-group>
      </trans-unit>
      <trans-unit id="2192507241536331751" datatype="html">
        <source>Some &amp; <x id="INTERPOLATION" equiv-text="{{ &apos;interpolated&apos; }}"/> attribute</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">3</context>
        </context-group>
      </trans-unit>
      <trans-unit id="5504137555058910768" datatype="html">
        <source>Some &amp; <x id="INTERPOLATION" equiv-text="{{ &quot;interpolated&quot; }}"/> message</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">4</context>
        </context-group>
      </trans-unit>
      <trans-unit id="2406634758623728945" datatype="html">
        <source>&amp;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">5</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4156372478368653226" datatype="html">
        <source>&amp;&quot;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">6</context>
        </context-group>
      </trans-unit>
      <trans-unit id="2720535395337591908" datatype="html">
        <source>&quot;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">7</context>
        </context-group>
      </trans-unit>
      <trans-unit id="3600934704948217447" datatype="html">
        <source>&quot;&quot;</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">8</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4906579891802234912" datatype="html">
        <source>Interpolation: <x id="INTERPOLATION" equiv-text="{{ one }}"/> Interpolation: <x id="INTERPOLATION_1" equiv-text="{{ two }}"/></source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/components/temp-page/temp-page.component.html</context>
          <context context-type="linenumber">10</context>
        </context-group>
      </trans-unit>
      <trans-unit id="4150330030790364157" datatype="html">
        <source>Hello i18n!</source>
        <context-group purpose="location">
          <context context-type="sourcefile">src/app/ng18i-check/layouts/ng18i-layout/ng18i-layout.component.html</context>
          <context context-type="linenumber">1</context>
        </context-group>
        <note priority="1" from="description">An introduction header for this sample</note>
      </trans-unit>
    </body>
  </file>
</xliff>

```