diff --git a/demo-shell/src/app/components/tag/tag.component.html b/demo-shell/src/app/components/tag/tag.component.html
index b6c8e1145e..4cf0b61bb9 100644
--- a/demo-shell/src/app/components/tag/tag.component.html
+++ b/demo-shell/src/app/components/tag/tag.component.html
@@ -19,7 +19,18 @@
{{'TAG.NODE_LIST' | translate }}
-
+
+
+
+
+ Show Delete Button
+
+
+
diff --git a/demo-shell/src/app/components/tag/tag.component.ts b/demo-shell/src/app/components/tag/tag.component.ts
index dd0d0c9b42..562289df6a 100644
--- a/demo-shell/src/app/components/tag/tag.component.ts
+++ b/demo-shell/src/app/components/tag/tag.component.ts
@@ -25,4 +25,9 @@ import { Component } from '@angular/core';
export class TagComponent {
nodeId = '';
+ showDelete = true;
+
+ toggleDeleteButton() {
+ this.showDelete = !this.showDelete;
+ }
}
diff --git a/docs/content-services/tag-node-list.component.md b/docs/content-services/tag-node-list.component.md
index 29fbab3b65..9744f92b9d 100644
--- a/docs/content-services/tag-node-list.component.md
+++ b/docs/content-services/tag-node-list.component.md
@@ -24,6 +24,7 @@ Shows tags for a node.
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| nodeId | `string` | | The identifier of a node. |
+| showDelete | `boolean` | true | Show delete button |
### Events
diff --git a/lib/content-services/tag/tag-node-list.component.html b/lib/content-services/tag/tag-node-list.component.html
index 6c1d57f305..016c479377 100644
--- a/lib/content-services/tag/tag-node-list.component.html
+++ b/lib/content-services/tag/tag-node-list.component.html
@@ -1,7 +1,7 @@
{{currentEntry.entry.tag}}
-
diff --git a/lib/content-services/tag/tag-node-list.component.spec.ts b/lib/content-services/tag/tag-node-list.component.spec.ts
index 89fcfe7672..46dc9b8e9a 100644
--- a/lib/content-services/tag/tag-node-list.component.spec.ts
+++ b/lib/content-services/tag/tag-node-list.component.spec.ts
@@ -103,5 +103,35 @@ describe('TagNodeList', () => {
component.ngOnChanges();
});
+
+ it('Should not show the delete tag button if showDelete is false', (done) => {
+ component.nodeId = 'fake-node-id';
+ component.showDelete = false;
+
+ component.results.subscribe(() => {
+ fixture.detectChanges();
+
+ let deleteButton: any = element.querySelector('#tag_chips_delete_test1');
+ expect(deleteButton).toBeNull();
+ done();
+ });
+
+ component.ngOnChanges();
+ });
+
+ it('Should show the delete tag button if showDelete is true', (done) => {
+ component.nodeId = 'fake-node-id';
+ component.showDelete = true;
+
+ component.results.subscribe(() => {
+ fixture.detectChanges();
+
+ let deleteButton: any = element.querySelector('#tag_chips_delete_test1');
+ expect(deleteButton).not.toBeNull();
+ done();
+ });
+
+ component.ngOnChanges();
+ });
});
});
diff --git a/lib/content-services/tag/tag-node-list.component.ts b/lib/content-services/tag/tag-node-list.component.ts
index b218d9b989..35a4044d01 100644
--- a/lib/content-services/tag/tag-node-list.component.ts
+++ b/lib/content-services/tag/tag-node-list.component.ts
@@ -34,6 +34,10 @@ export class TagNodeListComponent implements OnChanges {
@Input()
nodeId: string;
+ /** Show delete button */
+ @Input()
+ showDelete = true;
+
tagsEntries: any;
/** Emitted when a tag is selected. */