<now-attachments-list template="sp attachment" />

MCH · ‎11-07-2016

Hello,

I used the widget 'Ticket Attachments' in Service Portal of Helsinki.

In this widget there is an element which call 'now-attachments-list'.

I want to understand what the meaning of this element, maybe it's a directive of angular? so, where it's defined?

I would be happy if someone can explain me what is it exactly.

thanks,

Michal

ChrisBurks · ‎12-12-2016

Michal,

I apologize that my answer was not clear. When I stated that it was on the ServiceNow side, I meant that it's not directly accessible to us. It's directly accessible to ServiceNow employees on their side. You won't find it under any Module, Angular Providers or dependency sections.

That said, it doesn't mean you can't get to it. With a closer look by doing an Inspection, you can see how the directive is defined.

Here is the directive script:

angular.module('sn.common.attachments').directive('nowAttachmentsList', function(getTemplateUrl) {

   'use strict';

   return {

   restrict: 'E',

   replace: true,

   templateUrl: getTemplateUrl("attachments_list.xml"),

   link: function(scope, elem, attrs, $parse) {

   scope.icons = {

   preview: attrs.previewIcon,

   edit: attrs.editIcon,

   delete: attrs.deleteIcon,

   ok: attrs.okIcon,

   cancel: attrs.cancelIcon

   };

   scope.listClass = "list-group";

   var inline = scope.$eval(attrs.inline);

   if (inline)

   scope.listClass = "list-inline";

   scope.entryTemplate = getTemplateUrl(attrs.template || "attachment");

   }

   };

});

;

View solution in original post

xiaix · ‎05-18-2020

So following @ChrisBurks extremely precise instructions, here's how mine looks.

Here's the end result:

And here's the "custom_entry" code in case you'd like to copy it for yours:

<style>
  .eachAttachment {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr; 
    place-items: center;
  }
</style>

<!--
	We MUST use 'file-attachment' class in this first DIV because the self.updateAttachment 
  function looks for it!
		var parent = el.closest('.file-attachment');
-->
<div id="{{attachment.sys_id}}" 
     class="eachAttachment file-attachment">

  <!-- FILE NAME -->
  <div class="file-name" style="text-align: center;">
    <a ng-if="attachment.state === 'available'" 
       class="get-attachment ng-binding" 
       ng-click="attachmentHandler.downloadAttachment(attachment)" 
       ng-attr-title="Download {{attachment.file_name}}" 
       href="javascript:void(0)" 
       title="{{attachment.file_name}}">{{attachment.file_name}}<br />({{attachment.size}})</a>
    <input tabindex="-1" 
           ng-keydown="attachmentHandler.onKeyDown($event, attachment)" 
           ng-blur="attachmentHandler.updateAttachment($event, attachment)" 
           style="display: none;">
  </div>

  <!-- UPDATED ON -->
  <div style="text-align: center;">
    <time>
      <sn-time-ago timestamp="::attachment.sys_updated_on"></sn-time-ago>
    </time>
  </div>

  <!-- TOOLS -->
  <div class="tools">
    <div class="btn-group" role="group" ng-if="attachment.canWrite || attachment.canDelete">
      <button ng-if="attachment.canWrite &amp;&amp; attachment.state ==='available'" 
              type="button" 
              class="btn btn-default btn-clear" 
              ng-click="attachmentHandler.editAttachment($event, attachment)" 
              title="Edit file name">
        <i class="fa fa-pencil" aria-hidden="true"></i>
      </button>
      <button ng-if="attachment.canDelete" 
              type="button" 
              class="btn btn-default btn-clear" 
              ng-click="confirmDeleteAttachment(attachment, $event)" 
              title="Delete">
        <i class="fa fa-times" aria-hidden="true"></i>
      </button>
    </div>
  </div>
</div>

xiaix · ‎05-18-2020

And I guess you can ignore the code I pasted above because it seems that ServiceNow Community pages strip out and when trying to paste it. Hell, even trying to post this message with double open and double close brackets gets stripped. I had to insert them as images!!

ChrisBurks · ‎05-18-2020

@xiaix I appreciate the compliment on my instructions but I think you out did me. 🙂

Aaron Munoz · ‎04-13-2021

Following the replies from @ChrisBurks and @xiaix , has anyone figured out how to add columns as part of the template? For example to add the creation date/time.