Skip to main content

GdNestedPropertyPipe

The GdNestedPropertyPipe is an Angular pipe that allows accessing nested properties of an object using a dot-notated string path. It provides safe traversal by handling undefined or null intermediate values.

Import

import { GdNestedPropertyPipe } from '@geodome/gdk/common';

Usage

{{ complexObject | gdNestedProperty:'parent.child.property' }}

Parameters

  • propertyPath: A string representing the path to the desired property, using dot notation.
  • inputValue: The object to traverse.

Behavior

  • Accesses nested properties of an object based on the provided dot-notated path.
  • Returns undefined if the path is invalid or if any intermediate property is null or not an object.
  • If no dot notation is used, it returns the property directly from the input object.
  • Returns the input value as-is if the propertyPath is empty or the input is not an object.

Examples

const obj = { user: { profile: { name: 'John' } } };

{{ obj | gdNestedProperty:'user.profile.name' }} // Output: John
{{ obj | gdNestedProperty:'user.age' }} // Output: undefined
{{ obj | gdNestedProperty:'user' }} // Output: { profile: { name: 'John' } }

Use Cases

  • Accessing deeply nested properties in complex objects
  • Displaying data from nested API responses
  • Simplifying template expressions when working with multi-level object structures
note

This pipe is particularly useful when dealing with complex data structures or when the property path needs to be dynamic.

caution

Be cautious when using this pipe with potentially undefined or null values in the object hierarchy to avoid runtime errors.