Переменные ссылки на шаблон не определены в цикле ngFor

Вы ответили на свой вопрос частично в разделе комментариев.

Единственная действительная проверка выполняется на lastName. Это означает, что lastName не определено в тот момент, когда вы выполняете свой код.

Если вы согласны с неопределенностью, может сработать следующее.

<div *ngFor="let item of attributeList;let i = index">
<input type="{{item.type}}" class="form-control" id="usr_{{item.type}}_{{i}}" [(ngModel)]="item.value" name="usr{{i}}" #lastName="ngModel" required />

<div class="error-mesg" [hidden]="lastName?.valid || (lastName?.pristine && !form.submitted)">
    Field is required
  </div>
</div>

Отмечает вопросительные знаки, которые делают возможной безопасную навигацию, загружая пустое содержимое, если свойство не установлено: https://angular.io/guide/template-syntax#the-safe-navigation-operator----and-null-property дорожки

Редактировать:

Если вы хотите при определенных обстоятельствах скрыть div, содержащий предупреждение, я бы использовал * ngIf, чтобы проверить, является ли оно недействительным. В этом случае вы можете использовать? оператор.

<div *ngIf="lastName?.invalid || lastName?.dirty" class="error-mesg">
    Field is required
  </div>
</div>

Еще лучше было бы сделать такую логику внутри вашего файла .ts. Это облегчает юнит-тестирование кода. И используйте ngIf, который использует эту функцию. Но это мое личное предпочтение.