Angular 2 NgFor Regex 消息错误 - [(ngModel)] 有效但 ngModel 未定义

Question

我试图在 ngFor 循环中输入具有正则表达式要求的输入，但在我用作错误消息的地方出现“无法读取未定义的属性 'valid'”错误在页面加载时弹出。

这是我目前的代码：

（我的键管道是自定义管道，因为 item 是由对象组成的对象，因此将包含的对象分解为 key/value 对。）

<div *ngFor="let item of items | keys">

  <md-input-container>
    <input
      mdInput
      placeholder={{item.placeholder}}
      name={{item.name}}
      pattern="[\d{7}]*"
      [(ngModel)]="item.value.currentValue"
      #id="ngModel"
    >
  </md-input-container>

  <div 
    [hidden]="id.valid || id.pristine"
  >
    <div [hidden]="!id.hasError('pattern')">
        *Describe required pattern here*
    </div>
  </div>
  
</div>

根据我读过的一些教程（例如 this one），我想这会起作用，但我显然遗漏了一些东西。

编辑

因为有人要求，这里是钥匙管道。这是一个基本的管道，类似的管道在网络上随处可见：

  transform(value): any {
    const keys = [];
    for (const key in value) {
      keys.push({key: key, value: value[key]});
    }

    return keys;
  }

Answer 1

尝试使用 elvis 运算符，如下所示：[hidden]="id?.valid || id?.pristine"

Angular 2 NgFor Regex 消息错误 - [(ngModel)] 有效但 ngModel 未定义

Angular 2 NgFor Regex Message Error - [(ngModel)] works but ngModel is undefined

javascript

regex

ngfor

angular

编辑