File

C:/GoDev/src/TCSTK-Angular/projects/tibco-tcstk/tc-liveapps-lib/src/lib/components/live-apps-role-switcher/live-apps-role-switcher.component.ts

Description

Switch roles

Implements

OnInit

Example

<tcla-live-apps-role-switcher></tcla-live-apps-role-switcher>

Metadata

selector tcla-live-apps-role-switcher
styleUrls ./live-apps-role-switcher.component.css
templateUrl ./live-apps-role-switcher.component.html

Index

Properties
Methods
Inputs
Outputs

Constructor

constructor()

Inputs

roles
Type : RoleAttribute[]

Roles - The users current roles

selectedRole
Type : RoleAttribute

RoleAttribute - selected Role - check with MC

Outputs

changeRoleEvent
Type : EventEmitter<RoleAttribute>

~event changeRoleEvent : Role selected ~payload RoleAttribute : RoleAttribute object emitted when role is c hanged by switcher

Methods

ngOnInit
ngOnInit()
Returns : void

Properties

compareObjects
Default value : () => {...}
Public selectRole
Default value : () => {...}
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { RoleAttribute } from '@tibco-tcstk/tc-core-lib';

/**
 * Switch roles
 *
 *@example <tcla-live-apps-role-switcher></tcla-live-apps-role-switcher>
 */

@Component({
    selector: 'tcla-live-apps-role-switcher',
    templateUrl: './live-apps-role-switcher.component.html',
    styleUrls: ['./live-apps-role-switcher.component.css']
})
export class LiveAppsRoleSwitcherComponent implements OnInit {

  /**
   * Roles - The users current roles
   */
  @Input() roles: RoleAttribute[];

  /**
   * RoleAttribute - selected Role - check with MC
   */
  @Input() selectedRole: RoleAttribute;

  /**
   * ~event changeRoleEvent : Role selected
   * ~payload RoleAttribute : RoleAttribute object emitted when role is c hanged by switcher
   */
  @Output() changeRoleEvent: EventEmitter<RoleAttribute> = new EventEmitter<RoleAttribute>();


  constructor() { }

    ngOnInit() {
    }

    public selectRole = (role: RoleAttribute) => {
        this.changeRoleEvent.emit(role);
    }

    compareObjects = (o1: RoleAttribute, o2: RoleAttribute): boolean => {
        return o1.id === o2.id;
    }
}
<div>
    <mat-form-field>
        <mat-label>Viewing as</mat-label>
        <mat-select [(ngModel)]="selectedRole" (selectionChange)="selectRole(selectedRole)" [compareWith]="compareObjects"> 
            <mat-option *ngFor="let role of roles" [value]="role">{{role.display}}</mat-option>
        </mat-select>
    </mat-form-field>
</div>

./live-apps-role-switcher.component.css

Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""