fixed hyperlinks with composite names

Author: ppaska

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-dynamic-components",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "description": "NGX Dynamic Components is a configuration based dynamic components library for Angular. That allows you to rapidly create dynamic forms or any other mobile-friendly web layouts.",
   "author": "FalconSoft Ltd",
   "repository": {

projects/bootstrap/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngx-dynamic-components/bootstrap",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "private": false,
   "description": "@ngx-dynamic-components/bootstrap is Angular 7+ library what contains a bootstrap interfaces to build a configuration driven web pages and workflows.",
   "author": "FalconSoft Ltd <[email protected]>",

projects/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngx-dynamic-components/core",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "private": false,
   "description": "@ngx-dynamic-components/core is Angular 7+ library what contains a core interfaces to build a configuration driven web pages and workflows.",
   "author": "FalconSoft Ltd <[email protected]>",

projects/core/src/lib/html-elements/a/a.component.ts

@@ -44,6 +44,7 @@ export class AComponent extends BaseHTMLElement<LinkProperties> { // tslint:disa
         routerLink = routerLink.replace(m, res);
       });
     }
+
     return routerLink;
   }
 }

projects/core/src/lib/html-elements/ol/ol.element.ts

@@ -12,14 +12,23 @@ export const olDescriptor: ComponentDescriptor<BaseHTMLElementConstructor, HTMLP
   component: BaseHTMLElement,
   example: {
     title: 'HTML <ol> example',
-    uiModel: `<div>
-    <ol>
-    <li>item</li>
-    <li>item</li>
-    <li>item</li>
+    uiModel: `
+
+  <nav aria-label="breadcrumb">
+    <ol class="breadcrumb px-0">
+      <li class="breadcrumb-item"><a routerLink="app/{$.appInfo/ownerName}/{$.appInfo/appName}">Home</a></li>
+      <li class="breadcrumb-item"><a routerLink="app/{$.appInfo/ownerName}/{$.appInfo/appName}/orders-list">Orders</a></li>
+      <li class="breadcrumb-item active" aria-current="page">Details</li>
     </ol>
-    </div>`,
-    dataModel: {}
+  </nav>
+
+    `,
+    dataModel: {
+      appInfo: {
+        ownerName: 'TestUser',
+        appName: 'LongAppName'
+      }
+    }
   },
   parseUIModel: parseHTMLUIModel,
   defaultModel: '<ol></ol>'

projects/core/src/lib/utils/index.ts

@@ -78,6 +78,8 @@ export function queryValue(obj: any, path: string, defaultValue: any = null): an
   if (path.startsWith('$.')) {
     path = path.substring(2);
   }
+  path = path.replace('}', '')
+  path = path.replace('{', '')
 
   const props = path.indexOf('/') > 0 ? path.split('/') : path.split('.');
 

projects/tools/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngx-dynamic-components/tools",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "private": false,
   "description": "@ngx-dynamic-components/tools is Angular 7+ library what contains a core interfaces to build a configuration driven web pages.",
   "author": "FalconSoft Ltd <[email protected]>",