Angular24 中的ngreflect*属性有什么作用

添加ng-reflect-${name}个属性用于调试目的，并显示组件/指令在其类中声明的输入绑定.因此，如果您的组件是这样声明的:

class AComponent {
  @Input() data;
  @Input() model;
}

生成的HTML将呈现如下所示:

<a-component ng-reflect-data="..." ng-reflect-model="...">
   ...
<a-component>

它们仅在使用调试模式(Angular 的默认模式)时存在.要禁用它们，请使用

import {enableProdMode} from '@angular/core';

enableProdMode();

main.ts文件内部.这些属性加this function here:

function debugCheckAndUpdateNode(...): void {
  const changed = (<any>checkAndUpdateNode)(view, nodeDef, argStyle, ...givenValues);
  if (changed) {
    const values = argStyle === ArgumentType.Dynamic ? givenValues[0] : givenValues;
    if (nodeDef.flags & NodeFlags.TypeDirective) {
      const bindingValues: {[key: string]: string} = {};
      for (let i = 0; i < nodeDef.bindings.length; i++) {
        const binding = nodeDef.bindings[i];
        const value = values[i];
        if (binding.flags & BindingFlags.TypeProperty) {
          bindingValues[normalizeDebugBindingName(binding.nonMinifiedName !)] =
              normalizeDebugBindingValue(value); <------------------
        }
      }

    ...

    for (let attr in bindingValues) {
      const value = bindingValues[attr];
      if (value != null) {
        view.renderer.setAttribute(el, attr, value); <-----------------