Guest User

Untitled

a guest
Feb 23rd, 2018
89
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.86 KB | None | 0 0
  1. Example:
  2.  
  3.  
  4. <div [formGroup]="myGroup">
  5. <input formControlName="firstName">
  6. </div>
  7.  
  8. In your class:
  9.  
  10. this.myGroup = new FormGroup({
  11. firstName: new FormControl()
  12. });
  13. at Function.ReactiveErrors.missingFormException (forms.js:6347)
  14. at FormGroupDirective._checkFormPresent (forms.js:6852)
  15. at FormGroupDirective.ngOnChanges (forms.js:6623)
  16. at checkAndUpdateDirectiveInline (core.js:12358)
  17. at checkAndUpdateNodeInline (core.js:13886)
  18. at checkAndUpdateNode (core.js:13829)
  19. at debugCheckAndUpdateNode (core.js:14722)
  20. at debugCheckDirectivesFn (core.js:14663)
  21. at Object.eval [as updateDirectives] (EditVisitanteDialogComponent.html:10)
  22. at Object.debugUpdateDirectives [as updateDirectives] (core.js:14648)
  23.  
  24. <div class="dialog-content-wrapper">
  25. <mat-toolbar matDialogTitle class="mat-accent m-0">
  26. <mat-toolbar-row fxLayout="row" fxLayoutAlign="space-between center">
  27. <span class="title dialog-title">Editar visitante</span>
  28. <button mat-button class="mat-icon-button" (click)="dialogRef.close()" aria-label="Close dialog">
  29. <mat-icon>close</mat-icon>
  30. </button>
  31. </mat-toolbar-row>
  32. </mat-toolbar>
  33. <form name="form" [formGroup]="editForm" #f="ngForm">
  34. <div mat-dialog-content class="m-0 p-24" fusePerfectScrollbar>
  35. <div fxLayout="row" fxLayoutAlign="start start">
  36. <mat-icon class="mr-12 mt-12">label_outline</mat-icon>
  37. <mat-form-field class="mr-16">
  38. <mat-select placeholder="Documento" formControlName="documento">
  39. <mat-option value="option">Option</mat-option>
  40. </mat-select>
  41. </mat-form-field>
  42. <mat-form-field>
  43. <input matInput placeholder="Número" formControlName="numDocumento">
  44. </mat-form-field>
  45. </div>
  46.  
  47. <div fxLayout="row" fxLayoutAlign="start start">
  48. <mat-icon class="mr-12 mt-12">account_circle</mat-icon>
  49. <mat-form-field fxFlex>
  50. <input formControlName="nome" placeholder="Nome do Visitante" matInput required>
  51. </mat-form-field>
  52. </div>
  53.  
  54. <div fxLayout="row" fxLayoutAlign="start start">
  55. <mat-icon class="mr-12 mt-12">group</mat-icon>
  56. <mat-form-field fxFlex>
  57. <mat-select placeholder="Intenção" formControlName="motivoVisita">
  58. <mat-option value="option">Familiar</mat-option>
  59. <mat-option value="option">Particular</mat-option>
  60. <mat-option value="option">Prestado de Serviço</mat-option>
  61. </mat-select>
  62. </mat-form-field>
  63. </div>
  64.  
  65. <div fxLayout="row" fxLayoutAlign="start start">
  66. <mat-icon class="mr-12 mt-12">lock_open</mat-icon>
  67. <mat-form-field fxFlex>
  68. <mat-select placeholder="Autorização" formControlName="tipoAutorizacao">
  69. <mat-option value="option">Lorem ipsum...</mat-option>
  70. </mat-select>
  71. </mat-form-field>
  72. </div>
  73.  
  74. <div fxLayout="row" fxLayoutAlign="start start">
  75. <div fxLayout="column">
  76. <p>Quando?</p>
  77. <mat-radio-group formControlName="periodoAutorizacao">
  78. <mat-radio-button value="hoje">Hoje</mat-radio-button>
  79. <mat-radio-button value="semanal" class="ml-8">Semanal</mat-radio-button>
  80. <mat-radio-button value="periodo" class="ml-8">Período</mat-radio-button>
  81. </mat-radio-group>
  82.  
  83. <div id="periodo" fxLayout="row" fxLayoutAlign="space-evenly start">
  84. <mat-form-field fxFlex="45">
  85. <input matInput [matDatepicker]="picker" placeholder="De" formControlName="periodoDe">
  86. <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  87. <mat-datepicker #picker></mat-datepicker>
  88. </mat-form-field>
  89. <mat-form-field fxFlex="45">
  90. <input matInput [matDatepicker]="myDatepicker" placeholder="Até" formControlName="periodoAte">
  91. <mat-datepicker-toggle matSuffix [for]="myDatepicker"></mat-datepicker-toggle>
  92. <mat-datepicker #myDatepicker></mat-datepicker>
  93. </mat-form-field>
  94. </div>
  95.  
  96. <div id="semanal">
  97. <mat-checkbox formControlName="diaSem1">Seg</mat-checkbox>
  98. <mat-checkbox formControlName="diaSem2">Ter</mat-checkbox>
  99. <mat-checkbox formControlName="diaSem3">Qua</mat-checkbox>
  100. <mat-checkbox formControlName="diaSem4">Qui</mat-checkbox>
  101. <mat-checkbox formControlName="diaSem5">Sex</mat-checkbox>
  102. <mat-checkbox formControlName="diaSem6">Sáb</mat-checkbox>
  103. <mat-checkbox formControlName="diaSem7">Dom</mat-checkbox>
  104. </div>
  105. </div>
  106. </div>
  107.  
  108. <div>
  109. <mat-form-field fxFlex>
  110. <textarea matInput placeholder="Observação" formControlName="observacao"></textarea>
  111. </mat-form-field>
  112. </div>
  113.  
  114.  
  115. </div>
  116. <div mat-dialog-actions class="m-0 p-16" fxLayout="row" fxLayoutAlign="space-between center">
  117. <button mat-raised-button class="save-button mat-accent" aria-label="SAVE">
  118. SALVAR
  119. </button>
  120.  
  121. <button mat-button class="mat-icon-button" aria-label="Delete" matTooltip="Excluir">
  122. <mat-icon>delete</mat-icon>
  123. </button>
  124.  
  125. </div>
  126. </form>
  127. </div>
Add Comment
Please, Sign In to add comment