Hey there! Currently, I have an Angular 5 GUI and a Spring Boot application set up. In my Angular component designed for displaying images, I'm facing an issue where the image is not being displayed.
The code snippet from avatar.component.html:
<div class="avatar-circle" [style.background-image]="avatarBgImageStyle" [ngClass]="avatarClasses">
<fa-icon *ngIf="!user?.avatar" icon="user"></fa-icon>
</div>
<div class="labels" *ngIf="user && (showFullName || showAccount || showAuthority)">
<div *ngIf="showFullName" class="full-name">{{ fullName }}</div>
<div *ngIf="showAccount && user.account" class="secondary-text">{{ user.account.name }}</div>
<div *ngIf="showAuthority && user.authorities && user.authorities.length" class="secondary-text">{{ 'USER_ROLES.' + authority | translate }}</div>
</div>
From the avatar.component.ts file:
import { Component, Input, HostBinding } from '@angular/core';
import { User } from '../../models';
import { getUserFullName } from '../../utils';
import { FilesService } from '../../services';
@Component({
selector: 'pc-avatar',
templateUrl: './avatar.component.html',
styleUrls: ['./avatar.component.scss']
})
export class AvatarComponent {
// Code here...
}
I appreciate any help. Thank you!