{"record":{"id":"c2bd8c0449b42d81","repo":"angular/components","slug":"a-hint-was-already-declared-for-align-start","errorCode":null,"errorMessage":"A hint was already declared for 'align=\"start\"'.","messagePattern":"A hint was already declared for 'align=\"start\"'\\.","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"src/material/form-field/form-field.ts","lineNumber":678,"sourceCode":"  private _processHints() {\n    this._validateHints();\n    this._syncDescribedByIds();\n  }\n\n  /**\n   * Ensure that there is a maximum of one of each \"mat-hint\" alignment specified. The hint\n   * label specified set through the input is being considered as \"start\" aligned.\n   *\n   * This method is a noop if Angular runs in production mode.\n   */\n  private _validateHints() {\n    if (this._hintChildren && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n      let startHint: MatHint;\n      let endHint: MatHint;\n      this._hintChildren.forEach((hint: MatHint) => {\n        if (hint.align === 'start') {\n          if (startHint || this.hintLabel) {\n            throw getMatFormFieldDuplicatedHintError('start');\n          }\n          startHint = hint;\n        } else if (hint.align === 'end') {\n          if (endHint) {\n            throw getMatFormFieldDuplicatedHintError('end');\n          }\n          endHint = hint;\n        }\n      });\n    }\n  }\n\n  /**\n   * Sets the list of element IDs that describe the child control. This allows the control to update\n   * its `aria-describedby` attribute accordingly.\n   */\n  private _syncDescribedByIds() {\n    if (this._control) {","sourceCodeStart":660,"sourceCodeEnd":696,"githubUrl":"https://github.com/angular/components/blob/0411926e7d8ae06b32236ec1048a888cfad5abf2/src/material/form-field/form-field.ts#L660-L696","documentation":"A mat-form-field supports at most one start-aligned hint: either a <mat-hint align=\"start\"> or the field's hintLabel input, but not both, and never two start hints. The dev-mode check in MatFormField throws on duplicates to keep the hint row layout unambiguous.","triggerScenarios":"Declaring two <mat-hint align=\"start\"> elements inside one mat-form-field; or combining hintLabel=\"...\" with a <mat-hint> that has align=\"start\" (align defaults to start).","commonSituations":"Copy-pasted hint elements across template edits; a shared component adding a hint while the host template also sets hintLabel; developers unaware that omitting align on mat-hint defaults it to start.","solutions":["Remove one of the duplicate start hints, keeping either hintLabel or a single <mat-hint>","Set align=\"end\" on the second hint if two hints are genuinely needed (one start, one end)","Merge the hint texts into a single hint element or into hintLabel"],"exampleFix":"// before\n<mat-form-field hintLabel=\"Required\">\n  <input matInput>\n  <mat-hint>Enter your name</mat-hint>\n</mat-form-field>\n// after\n<mat-form-field>\n  <input matInput>\n  <mat-hint>Required — enter your name</mat-hint>\n</mat-form-field>","handlingStrategy":"validation","validationCode":"// Ensure at most one start hint per form field:\n// one hintLabel OR one <mat-hint> (align defaults to 'start').\n<mat-form-field>\n  <input matInput>\n  <mat-hint align=\"start\">Only one start hint</mat-hint>\n  <mat-hint align=\"end\">End hint allowed</mat-hint>\n</mat-form-field>","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Remember mat-hint defaults to align=\"start\" — set align=\"end\" for extra hints","Never combine hintLabel with a start-aligned mat-hint","Watch shared wrapper components that inject their own hints into fields"],"tags":["angular","material","form-field","template","hints"],"backgroundTag":"duplicate-hint-alignment","analyzedSha":"0411926e7d8ae06b32236ec1048a888cfad5abf2","analyzedAt":"2026-08-31T11:58:23.400Z","schemaVersion":2},"datasetVersion":"2026-08-31T14:17:45.589Z"}