COURSE OBJECTIVE:
After you complete this course you will be able to:
• Develop their own custom Widgets.
• Learn how to script using built-in AngularJS directives, services and ServiceNow's Service Portal APIs.
• Use Widget debugging techniques.
• Understand how a Widget transfers data between the server and the client.
• Identify the external libraries installed in the platform.
• Bring in 3rd party directives.
• Develop their own custom directives (Dependencies).
• Create re-usable client-side scripts (Angular Providers).
• Write and call HTML stored in a separate record (Angular ng-templates).
• Embed a Widget within another Widget.
• Instruct Widgets to publish, listen for, and respond to events.
• Integrate Widgets with components and services outside of the Service Portal.
TARGET AUDIENCE:
This course is designed for pro-code System Administrators and Application Developers who want to learn how to develop advanced Service Portals components. You will be expected to script.
COURSE PREREQUISITES:
Attendees should meet the following prerequisites:
COURSE CONTENT:
Service Portal Review
• This module is a high-level review of the components from the Service Portal Fundamentals course that are relevant for this class.
• Define a Service Portal.
• Review the fundamentals.
• Lab 1.1 – Create a Service Portal
Widget Development 100
• Learn how to develop Widgets using the fields accessible via the Widget Editor.
• Introduce a Widget development strategy.
• Understand how a Widget transfers data between the server and the client.
• Learn how to use built-in AngularJS directives, services and ServiceNow's Service Portal APIs.
• Discuss Widget debugging strategies.
• Lab 2.1 – Load Initial Data from the Server
• Lab 2.2 – Display Initial Data to the User
• Lab 2.3 – Accept and Process User Input
Widget Development 200
• Review the remaining fields in the Widget record (accessed via the Form view in the Platform UI).
• Explore AngularJS expressions.
• Review how to apply style to Widgets.
• Discover how to add and use Widget Options.
• Learn how to manipulate the DOM using a Link Function.
• Lab 3.1 – Using Expressions
• Lab 3.2 – Sorting Lists and Using recordWatch()
• Lab 3.3 – Widget Options
• Lab 3.4 – Custom Widget Options (Optional)
• Lab 3.5 – Write a Link Function
Widget Development 300
• Focuses on reviewing each of the Widget record's Related Lists.
• Explore additionally installed external libraries.
• Discuss Widget Dependencies.
• Learn about Angular Providers.
• Review Angular ng-templates.
• Lab 4.1 – Explore AngularJS and UI Bootstrap Directives
• Lab 4.2 – Dependencies and 3rd Party Directives
• Lab 4.3 – Create a Custom Directive
• Lab 4.4 – Create a Custom Service
Widgets Working Together
• Focuses on how Widgets can be embedded and communicate internally and externally.
• Discuss how Widgets can be embedded within another Widget.
• Review how Widgets Communicate.
• Explore how Widgets send/receive information.
• Lab 5.1 – Embed the 'form' Widget in a Modal
• Lab 5.2 – Communication Between Widgets
• Lab 5.3 – Make a REST API Call
FOLLOW ON COURSES:
Not available. Please contact.