Ignite UI for Angular

すべて
  • パブリック
  • パブリック/保護
  • すべて

クラス 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

コンストラクタ

プロパティ

アクセサー

コンストラクタ

constructor

プロパティ

ariaLabel

ariaLabel: string = 'avatar'

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

例:
let ariaLabel = this.avatar.ariaLabel;

bgColor

bgColor: string

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

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

Background color

color

color: string

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

例:
<igx-avatar color="blue"></igx-avatar>

elementRef

elementRef: ElementRef<any>

icon

icon: string

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

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

id

id: string = ...

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

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

initials

initials: string

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

例:
<igx-avatar initials="MN"></igx-avatar>

role

role: string = 'img'

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

例:
let avatarRole = this.avatar.role;

roleDescription

roleDescription: string

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

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

roundShape

roundShape: boolean = false

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

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

src

src: string

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

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

Image URL

アクセサー

size

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

type