クラス IgxAvatarComponent

アバターは、画像、アイコン、またはイニシャルを表示する方法を提供します。

igxmodule

IgxAvatarModule

igxtheme

igx-avatar-theme, igx-icon-theme

igxkeywords

avatar, profile, picture, initials

igxgroup

Layouts

備考:

Ignite UI Avatar はアプリケーションにアバター アイコンを追加するコンポーネントです。 アイコンは画像、イニシャル、または Google マテリアル アイコン セットのマテリアル アイコンが可能です。

例:
<igx-avatar initials="MS" [roundShape]="true" size="large">
</igx-avatar>

階層

  • IgxAvatarComponent

実装

  • OnInit

Index

コンストラクタ

プロパティ

ariaLabel: string = 'avatar'

アバターの aria-label 属性を返します。

例:
let ariaLabel = this.avatar.ariaLabel;
bgColor: string

アバターの背景色を設定します。

例:
<igx-avatar bgColor="yellow"></igx-avatar>
igxfriendlyname

Background color

color: string

アバターの initials および icon 色を設定します。

例:
<igx-avatar color="blue"></igx-avatar>
elementRef: ElementRef<any>
icon: string

アバターに icon を設定します。マテリアル アイコン セットのすべてのアイコンがサポートされます。

例:
<igx-avatar icon="phone"></igx-avatar>
id: string = ...

アバターの id を設定します。設定されない場合、最初のアバター コンポーネントの id"igx-avatar-0" になります。

例:
<igx-avatar id="my-first-avatar"></igx-avatar>
initials: string

アバターに initials を設定します。

例:
<igx-avatar initials="MN"></igx-avatar>
role: string = 'img'

アバターの role 属性を返します。

例:
let avatarRole = this.avatar.role;
roleDescription: string

アバターのタイプを返します。 アバターのタイプは:

  • "initials タイプのアバター"
  • "icon タイプのアバター"
  • "image タイプのアバター"
  • "custom タイプのアバター"
例:
let avatarDescription = this.avatar.roleDescription;
roundShape: boolean = false

[roundShape]true に設定されている場合、アバターを丸形に設定します。 アバターの図形はデフォルトで四角です。

例:
<igx-avatar [roundShape]="true" ></igx-avatar>
src: string

アバターの画像ソースを設定します。

例:
<igx-avatar src="images/picture.jpg"></igx-avatar>
igxfriendlyname

Image URL

アクセサー

  • get size(): string
  • set size(value: string): void