File
Implements
|
selectedEntity
|
Type : any
|
|
|
Outputs
|
onAction
|
Type : EventEmitter
|
|
|
Methods
|
action
|
action(entity, type)
|
|
|
Parameters :
| Name |
Optional |
| entity |
No
|
| type |
No
|
|
import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core';
@Component({
selector: 'entity-list',
templateUrl: './entity-list.component.html',
styleUrls: ['./entity-list.component.scss']
})
export class EntityListComponent implements OnInit {
@Input() entities;
@Input() selectedEntity;
@Output() onAction = new EventEmitter();
constructor() { }
ngOnInit() { }
action(entity, type) {
this.onAction.emit({ action: type, data: entity });
}
}
<div class="d-flex flex-dc flex-w-wrap entity-list" *ngFor="let entity of entities">
<div class="d-flex sb-radio-btn-checkbox sb-radio-btn-primary flex-jc-space-between">
<div class=" w-100"> <input type="radio" id="{{entity._id}}" name="radio-group"
[checked]="entity._id == selectedEntity._id" value="{{entity._id}}" (change)="action(entity,'change')">
<label for="{{entity._id}}" class="d-flex w-100 flex-jc-space-between">
{{entity?.name}}
</label>
</div>
<div>
<i class="trash large icon" *ngIf="entity.submissionsCount == 0" tabindex="0" (click)="action(entity,'delete')">
</i>
</div>
</div>
</div>
@use "@project-sunbird/sb-styles/assets/mixins/mixins" as *;
.entity-list{
background: var(--sb-card-bg);
padding: calculateRem(10px) calculateRem(24px);
border-radius: calculateRem(30px);
margin: calculateRem(15px) 0px;
label{
margin-bottom:0px;
}
.icon {
color: var(--primary-400) !important;;
}
.icon:hover{
cursor: pointer;
}
}
Legend
Html element with directive