模板检查未发生/更改检测器未运行（角度）

Question

由于某种原因，我的 Angular 模板中没有运行更改检测。我正在尝试根据第二个 div（文本框）中的文本更改来更改第一个 div 的颜色。下面是代码的样子：

<div [ngStyle]="{'background-color': titleText.innerText? 'red' : 'blue' }">Title</div>
<div style="border:1px solid black" contenteditable="true" aria-multiline="true" role="textbox" ngDefaultControl #titleText></div>

在运行时，当我在文本框中输入一些文本时，第一个 div 的颜色不会变为红色。但是，在编译之前，如果我将一些文本传递给 div，则在运行时会显示红色，再次从文本框中删除文本不会改变颜色。我觉得没有进行模板检查。

这里是回购链接：https://github.com/enzup/dummy/blob/master/src/app/app.component.html

我在 tsconfig.json 中的 'angularCompilerOptions' 下将 'fullTemplateTypeCheck' 设置为 true，尝试安装多个项目，使用不同的 Angular 版本（8、9、10、11），但它们似乎都不起作用。但是尝试在 ngAfterViewInIt() 中取消注释 app.component.ts 文件中的代码，第一个 div 开始根据第二个 div 中的文本更改更改其颜色就好了，除了每 5000 毫秒触发一次更改（这是在 setInterval 中传递的时间())。也许更改检测正在强制进行模板检查？

这是我从 stackblitz 克隆的另一个 repo：https://github.com/enzup/angular-ivy-oghnan/blob/master/src/app/app.component.html

模板与第一个 repo 中的相同。但是这里一切正常。我不确定为什么会这样。我已经比较了两个存储库，它们的 tsconfig.json、angular.json、package.json，但没有任何问题或不同。请帮助我理解为什么第一个 repo 没有产生预期的结果，而第二个 repo 却完美无缺。

附言。我知道有一些解决方法可以更改 div 的背景颜色，而不是我目前正在尝试遵循的，但这不是我所追求的，ngClass 也不起作用（仅在第一个 repo 中，在其次它再次正常工作）。我想了解为什么第一个 repo 行为不正常，而第二个 repo 则不然。

Answer 1

您忘记在 app.module 中导入 FormsModule。 顺便说一句，您确定您了解自定义 controlValueAccessors，因为您似乎使用过 ngDefaultControl。 我建议您阅读为什么需要 controlValue 访问器。 模板类型检查也与更改检测无关（它只是用于检查您的 html 绑定的类型。）