Angular Ivy strictTemplates true类型'boolean | null‘不能赋值给类型'boolean’

Question

我已经将我的应用程序更新到了9版本。一切都很好，但我对strictTemplates设置为true有问题。例如，下面的代码

loaded$: Observable<boolean>
[loaded]="loaded$ | async"
@Input() loaded!: boolean;

我得到一个错误，类型'boolean | null‘不能赋值给类型'boolean’。

这样就修复了错误

@Input() loaded!: boolean | null;

但是我不明白这一点，有人能给我解释一下吗？

Answer 1

原因是因为async管道返回签名类似于<T>(input$: Observable<T>): T | null always，因为它在等待异步调用的响应时将null返回给模板。

更多信息请点击这里：https://angular.io/guide/template-typecheck#strict-null-checks

您可以执行已执行的操作并允许null，或者，如果您知道它永远不会为null，则使用非null断言操作符：

[loaded]="(loaded$ | async)!"

或在此处禁用类型检查：

[loaded]="$any(loaded$ | async)"

或者，对于这个特殊的情况，您可能会这样做：

[loaded]="(loaded$ | async) || false"

Answer 2

我相信，在Typescript 2X版本之后，null和undefined不再是其他类型的子类型，这是更多的Typescript更新错误而不是角度更新，这是一如既往地提供更多的编译时间。静态类型检查。

如果你的实际类型是一个布尔值，并且你是作为null接收的，这对你没有太大的影响，但是如果你的实际类型是一个对象，你必须释放Typescript会强制你做所有真实的检查，这样你就不会陷入运行时错误。

事实证明，Javscript中的所有东西都是对象，但我们通常不使用boolean作为对象，但如果我们使用：

​

let a = true;
console.log(a.toString());
a = null;
console.log(a.toString());

​