C:/GoDev/src/TCSTK-Angular/projects/tibco-tcstk/tc-liveapps-lib/src/lib/components/live-apps-role-switcher/live-apps-role-switcher.component.ts
Switch roles
<tcla-live-apps-role-switcher></tcla-live-apps-role-switcher>
selector | tcla-live-apps-role-switcher |
styleUrls | ./live-apps-role-switcher.component.css |
templateUrl | ./live-apps-role-switcher.component.html |
Properties |
|
Methods |
Inputs |
Outputs |
constructor()
|
roles | |
Type : RoleAttribute[]
|
|
Roles - The users current roles |
selectedRole | |
Type : RoleAttribute
|
|
RoleAttribute - selected Role - check with MC |
changeRoleEvent | |
Type : EventEmitter<RoleAttribute>
|
|
~event changeRoleEvent : Role selected ~payload RoleAttribute : RoleAttribute object emitted when role is c hanged by switcher |
ngOnInit |
ngOnInit()
|
Returns :
void
|
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