alfresco-ng2-components/docs/process-services-cloud/components/group-cloud.component.md

Title, Added, Status, Last reviewed

Title	Added	Status	Last reviewed
Group Cloud component	v3.0.0	Experimental	2019-03-20

Group Cloud component

Searches Groups.

Basic Usage

<adf-cloud-group
    [appName]="'simple-app'"
    [mode]="'multiple'">
</adf-cloud-group>

Class members

Properties

Name	Type	Default value	Description
appName	string		Name of the application. If specified this shows the users who have access to the app.
mode	string		User selection mode (single/multiple).
preSelectGroups	IdentityGroupModel[]	[]	Array of users to be pre-selected. This pre-selects all users in multi selection mode and only the first user of the array in single selection mode.
roles	string[]	[]	Role names of the groups to be listed.
searchGroupsControl	FormControl	new FormControl()	FormControl to search the group
title	string		Title of the field

Events

Name	Type	Description
removeGroup	EventEmitter<IdentityGroupModel>	Emitted when a group is removed.
selectGroup	EventEmitter<IdentityGroupModel>	Emitted when a group is selected.

Details

Selection Mode

You can specify either single selection or multiple selection (single is the default):

Single selection

<adf-cloud-group></adf-cloud-group>

Multiple selection

<adf-cloud-group
    [mode]="'multiple'">
</adf-cloud-group>

Pre-selection

Usage example:

import { ObjectDataTableAdapter }  from '@alfresco/adf-core';

@Component({...})
export class MyComponent {
    groups: any;

    constructor() {
        this.groups =
            [
                {id: 1, name: 'Group 1'},
                {id: 2, name: 'Group 2'}
            ];
    }
}

<adf-cloud-group
    [mode]="'multiple'"
    [preSelectGroups]="groups">
</adf-cloud-group>

Read-only

You can use readonly property to make preselected groups read-only in multiple mode.

Usage example:

import { ObjectDataTableAdapter }  from '@alfresco/adf-core';

@Component({...})
export class MyComponent {
    groups: any;

    constructor() {
        this.groups =
            [
                {id: 1, name: 'Group 1', readonly: true},
                {id: 2, name: 'Group 2', readonly: false}
            ];
    }
}

<adf-cloud-group
    [mode]="'multiple'"
    [preSelectGroups]="groups">
</adf-cloud-group>

from above preSelectGroups, Group 2 is removable from the preSelectGroups whereas Group 1 is readonly you can not remove them.