angular 无法读取空值(null)的属性：'_rawValidators'

llmtgqce 于 5个月前发布在 Angular

关注(0)|答案(8)|浏览(65)

哪个@angular/*包是bug的来源？

forms

这是个回归吗？

否

描述

错误抛出：无法读取null的属性('_rawValidators')
这并不能告诉用户问题出在哪里(哪个组件),也不能告诉无效的表单控件名称是什么。在非生产模式下，这种情况处理得更好，但当我们试图调试生产环境中的问题时，不知道如何重现问题，这就无能为力了。
我们将未处理的错误记录到DataDog,当我们收到这个错误时，基本上我们无法采取行动或修复它，因为堆栈跟踪中没有提供有用的信息。

请提供一个最小复现bug的链接

https://stackblitz.com/edit/stackblitz-starters-cgg4uh?file=src%2Fapp%2Fforms%2Fforms.component.html

请提供您看到的异常或错误

TypeError: Cannot read properties of null (reading '_rawValidators')
    at getControlValidators (@angular_forms.js?v=a1e73860:721:18)
    at setUpValidators (@angular_forms.js?v=a1e73860:2545:22)
    at setUpControl (@angular_forms.js?v=a1e73860:2500:3)
    at _FormGroupDirective.addControl (@angular_forms.js?v=a1e73860:4087:5)
    at _FormControlName._setUpControl (@angular_forms.js?v=a1e73860:4611:39)
    at _FormControlName.ngOnChanges (@angular_forms.js?v=a1e73860:4560:12)
    at _FormControlName.rememberChangeHistoryAndInvokeOnChangesHook (chunk-H7PDWKI7.js?v=a1e73860:5775:10)
    at callHookInternal (chunk-H7PDWKI7.js?v=a1e73860:6341:10)
    at callHook (chunk-H7PDWKI7.js?v=a1e73860:6359:5)
    at callHooks (chunk-H7PDWKI7.js?v=a1e73860:6330:9)

请提供您发现此bug的环境(运行`ng version`)

Angular CLI: 17.3.8
Node: 18.20.3
Package Manager: npm 10.2.3
OS: linux x64

Angular: 17.3.12
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1703.8
@angular-devkit/build-angular   17.3.8
@angular-devkit/core            17.3.8
@angular-devkit/schematics      17.3.8
@angular/cli                    17.3.8
@schematics/angular             17.3.8
rxjs                            7.8.1
typescript                      5.3.3
zone.js                         0.14.8

还有其他信息吗？

无响应*

Angular

来源：https://github.com/angular/angular/issues/57236

8条答案

按热度按时间

jutyujz01#

看起来这个问题已经在过去被报告过了：#48379
但是那个问题已经关闭了。我创建了一个stackblitz来重现这个问题。

赞(0）回复(0）举报 5个月前

5ktev3wc2#

这是在生产模式开启时不会抛出的有用错误(取自部署的JavaScript):

function setUpControl(control, dir, callSetDisabledState = setDisabledStateDefault) {
  if (typeof ngDevMode === "undefined" || ngDevMode) {
    if (!control)
      _throwError(dir, "Cannot find control with");
    if (!dir.valueAccessor)
      _throwMissingValueAccessorError(dir);
  }
  setUpValidators(control, dir);
...

赞(0）回复(0）举报 5个月前

qjp7pelc3#

formControlName ( c ) 不存在是故意的吗？

@if ( recreateBug() ) {
  <label>
    Control c:
    <input type="text" formControlName="c" />
  </label>
  }

您的定义是

#createFormGroup(): FormGroup {
    return new UntypedFormGroup({
      a: new FormControl('a'),
      b: new FormControl('b'),
    });
  }

赞(0）回复(0）举报 5个月前

kknvjkwl4#

是的，这就是问题所在，当它遇到一个错误的表单控件名称时，会抛出一个错误，但没有提供任何信息。
在我们的情况下，我们的表单控件是从数据库信息动态创建的。在我们的DataDog崩溃日志中，我们记录了这个错误，但问题在于我们没有任何关于使用了哪个表单控件名称、用户在应用程序的哪个部分等的信息。不幸的是，这意味着在没有更多信息的情况下，我们无法解决这个问题。

赞(0）回复(0）举报 5个月前

erhoui1w5#

这是一个仅在开发模式下抛出的诊断错误链接：
angular/packages/forms/src/directives/shared.ts
第70行 d73a374
| | if(typeofngDevMode==='undefined'||ngDevMode){ |

赞(0）回复(0）举报 5个月前

rqenqsqc6#

我明白了，一个问题是我们在生产环境中去除了错误信息，只记录错误代码，所以这对你帮助不大。我们只在错误模式下记录问题，以使生产包尽可能小。

赞(0）回复(0）举报 5个月前

ix0qys7i7#

是的，就是这样。这不是Angular的bug,我只是在问题发生时请求帮助来找到问题的根源。如果能知 prop 有formControlName指令的模板的组件并传递了错误的值(或者表单控件可能尚未通过动态创建的表单创建时的计时问题),那将会非常有帮助。

赞(0）回复(0）举报 5个月前

6ss1mwsb8#

任何可能对调试有用的信息都故意设计在生产构建中被移除，以免影响捆绑包的大小。因此，我认为错误消息无法在生产环境中得到改进。