Avatar profile (uploader)
A large avatar with an upload control for profile photos.
Preview
A working preview of Avatar profile (uploader) in the Brickclay style. Try it.
AAProfile photo500×500 JPEG, PNG · Max 500KB
SKLoading state
Interact with the preview to see events here.
Avatars
Interactive Demo, try uploading, removing & watch the event log
Max 67 KB · JPEG, PNG
Tip: Try uploading a file larger than 67 KB to trigger a fileError event.
ngModel + CVA + Error Handling
The bk-avatar-uploader component implements ControlValueAccessor so it works with [(ngModel)], formControlName, required, hasError, and errorMessage.
Error State
required + touched + no value = error
Tip: For the Error State example, click somewhere on the page after hovering over the avatar to mark it as touched, then see the required error appear.