fix(grid): changing sample, updating to alpha 2

Author: ChronosSF

live-editing/configs/HierarchicalGridConfigGenerator.ts

@@ -935,8 +935,7 @@ export class HierarchicalGridConfigGenerator implements IConfigGenerator {
         }));
 
         configs.push(new Config({
-            additionalFiles: ['/src/app/directives/prevent-scroll.directive.ts', '/src/app/data/singersData.ts',
-                '/src/app/hierarchical-grid/models.ts'],
+            additionalFiles: ['/src/app/directives/prevent-scroll.directive.ts', '/src/app/data/hierarchical-data.ts'],
             appModuleConfig: new AppModuleConfig({
                 imports: ['IgxPreventDocumentScrollModule', 'IgxHierarchicalGridModule', 'HGridColumnAutoSizingSampleComponent'],
                 ngDeclarations: ['HGridColumnAutoSizingSampleComponent'],

package-lock.json

@@ -63,7 +63,7 @@
     "domino": "^2.1.4",
     "file-saver": "^2.0.2",
     "hammerjs": "^2.0.8",
-    "igniteui-angular": "^14.1.0-alpha.1",
+    "igniteui-angular": "^14.1.0-alpha.2",
     "igniteui-angular-charts": "^14.0.0",
     "igniteui-angular-core": "^14.0.0",
     "igniteui-angular-i18n": "^14.0.2",

package.json

@@ -1,36 +1,35 @@
 <div class="grid__wrapper">
-    <igx-hierarchical-grid igxPreventDocumentScroll  class="hierarchicalGrid" [data]="localData" [autoGenerate]="false" [height]="'520px'"
-        [width]="'100%'" [rowHeight]="'65px'" #hierarchicalGrid>
-        <igx-column field="Artist" width="auto" [resizable]="true"></igx-column>
-        <igx-column field="Photo" width="auto" [resizable]="true" [minWidth]="'115px'">
-            <ng-template igxCell let-cell="cell">
-                <div class="cell__inner_2">
-                    <img [src]="cell.value" class="photo" />
-                </div>
-            </ng-template>
-        </igx-column>
-        <igx-column field="Debut" width="auto" [resizable]="true" [minWidth]="'88px'" [maxWidth]="'230px'" dataType="number" [formatter]="formatter"></igx-column>
-        <igx-column field="GrammyNominations" header="Grammy Nominations" width="auto" [resizable]="true"></igx-column>
-        <igx-column field="GrammyAwards" header="Grammy Awards" width="auto" [resizable]="true"></igx-column>
-
-        <igx-row-island [height]="null" [key]="'Albums'" [autoGenerate]="false">
-            <igx-column field="Album" width="auto" [resizable]="true"></igx-column>
-            <igx-column field="LaunchDate" header="Launch Date" width="auto" [resizable]="true" [dataType]="'date'"></igx-column>
-            <igx-column field="BillboardReview" header="Billboard Review" width="auto" [resizable]="true"></igx-column>
-            <igx-column field="USBillboard200" header="US Billboard 200" width="auto" [resizable]="true"></igx-column>
-            <igx-row-island [height]="null" [key]="'Songs'" [autoGenerate]="false">
-                <igx-column field="Number" header="No." width="auto" [resizable]="true"></igx-column>
-                <igx-column field="Title" width="auto" [resizable]="true"></igx-column>
-                <igx-column field="Released" dataType="date" width="auto" [resizable]="true"></igx-column>
-                <igx-column field="Genre" width="auto" [resizable]="true"></igx-column>
+    <igx-hierarchical-grid igxPreventDocumentScroll #hierarchicalGrid [data]="localdata"
+        [height]="'490px'" [width]="'100%'">
+        <igx-column field="CustomerID" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="CompanyName" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="ContactName" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="ContactTitle" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="Address" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="City" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="PostalCode" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="Country" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="Phone" width="auto" [resizable]="true"></igx-column>
+        <igx-column field="Fax" width="auto" [resizable]="true"></igx-column>
+        <igx-row-island [height]="null" [key]="'Orders'" [autoGenerate]="false">
+            <igx-column field="OrderID" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="EmployeeID" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="OrderDate" width="auto" [dataType]="'date'" [resizable]="true"></igx-column>
+            <igx-column field="RequiredDate" width="auto" [dataType]="'date'" [resizable]="true"></igx-column>
+            <igx-column field="ShippedDate" width="auto" [dataType]="'date'" [resizable]="true"></igx-column>
+            <igx-column field="ShipVia" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="Freight" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="ShipName" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="ShipAddress" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="ShipCity" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="ShipPostalCode" width="auto" [resizable]="true"></igx-column>
+            <igx-column field="ShipCountry" width="auto" [resizable]="true"></igx-column>
+            <igx-row-island [height]="null" [key]="'OrderDetails'" [autoGenerate]="false" [moving]="true">
+                <igx-column field="ProductID" width="auto" [resizable]="true"></igx-column>
+                <igx-column field="UnitPrice" width="auto" [resizable]="true"></igx-column>
+                <igx-column field="Quantity" width="auto" [resizable]="true"></igx-column>
+                <igx-column field="Discount" width="auto" [resizable]="true"></igx-column>
             </igx-row-island>
         </igx-row-island>
-
-        <igx-row-island [height]="null" [key]="'Tours'" [autoGenerate]="false">
-            <igx-column field="Tour" width="auto" [resizable]="true"></igx-column>
-            <igx-column field="StartedOn" header="Started on" width="auto" [resizable]="true"></igx-column>
-            <igx-column field="Location" width="auto" [resizable]="true"></igx-column>
-            <igx-column field="Headliner" width="auto" [resizable]="true"></igx-column>
-        </igx-row-island>
     </igx-hierarchical-grid>
 </div>