Angular Custom Pipe for Data Formatting

You're tasked with creating a custom Angular pipe to transform data displayed in your application. This is a common requirement for formatting dates, currency, strings, or any other data type to suit user interface needs. Building a reusable pipe will improve code organization and maintainability.

Problem Description

Create a custom Angular pipe named DataFormatterPipe that takes a value as input and applies specific formatting rules based on an optional argument.

Requirements:

1. Pipe Creation: Implement a custom pipe in TypeScript that can be used within Angular templates.
2. Input Value: The pipe should accept any type of value.
3. Formatting Options:
   • Default: If no argument is provided, the pipe should simply return the input value as is.
   • 'uppercase': If the argument is 'uppercase', convert the input string to uppercase.
   • 'lowercase': If the argument is 'lowercase', convert the input string to lowercase.
   • 'truncate:<number>': If the argument is in the format 'truncate:<number>' (e.g., 'truncate:10'), truncate the input string to the specified number of characters. If the string is longer than the specified number, append "..." to the end. If the string is shorter or equal, return it as is.
4. Handling Non-Strings: For formatting options that are string-specific ('uppercase', 'lowercase', 'truncate'), if the input value is not a string, it should be returned as is.
5. Pipe Registration: Ensure the pipe is correctly declared in an Angular module.

Expected Behavior:

• When used in a template, the pipe should dynamically apply the specified formatting.
• The pipe should be robust enough to handle various input types gracefully.

Edge Cases:

• Input is null or undefined.
• The number provided for truncate is zero or negative.
• The string to be truncated is empty.

Examples

Example 1:

Input Value: "hello world"
Pipe Argument: "uppercase"
Output: "HELLO WORLD"
Explanation: The input string is converted to uppercase as per the provided argument.

Example 2:

Input Value: "Angular is awesome!"
Pipe Argument: "truncate:10"
Output: "Angular is..."
Explanation: The input string is truncated to 10 characters and "..." is appended because the original string was longer.

Example 3:

Input Value: 12345
Pipe Argument: "uppercase"
Output: 12345
Explanation: The input is a number, not a string. String-specific formatting is ignored, and the original value is returned.

Example 4:

Input Value: "short"
Pipe Argument: "truncate:10"
Output: "short"
Explanation: The input string is shorter than the specified truncation length, so it's returned as is.

Example 5:

Input Value: null
Pipe Argument: "uppercase"
Output: null
Explanation: Handling of null input value.

Example 6:

Input Value: "another example"
Pipe Argument: "truncate:0"
Output: "..."
Explanation: Truncating to 0 characters results in an empty string followed by "...".

Constraints

• The pipe must be implemented using Angular's PipeTransform interface.
• The pipe should be designed for efficiency, especially with string manipulations.
• The input for the truncate argument is expected to be an integer. Any non-integer values for the number should be treated as invalid and the truncation should not occur (return original value).

Notes

• Consider how to parse the truncate:<number> argument effectively.
• Think about how to handle cases where the input value might not be a string when string-specific transformations are requested.
• Ensure your pipe is properly declared in an Angular module (e.g., AppModule or a shared module) to be usable in templates.