Merge branch '8.1.x' into mkirova/fix-4520-8.1.x

Author: ChronosSF

projects/igniteui-angular/src/lib/buttonGroup/buttonGroup.component.ts

@@ -279,7 +279,6 @@ export class IgxButtonGroupComponent extends DisplayDensityBase implements After
 
     /**
      * Selects a button by its index.
-     * @memberOf {@link IgxButtonGroupComponent}
      *```typescript
      *@ViewChild("MyChild")
      *private buttonG: IgxButtonGroupComponent;
@@ -288,6 +287,7 @@ export class IgxButtonGroupComponent extends DisplayDensityBase implements After
      *    this.cdr.detectChanges();
      *}
      *```
+     * @memberOf {@link IgxButtonGroupComponent}
      */
     public selectButton(index: number) {
         if (index >= this.buttons.length || index < 0) {
@@ -326,7 +326,6 @@ export class IgxButtonGroupComponent extends DisplayDensityBase implements After
 
     /**
      * Deselects a button by its index.
-     * @memberOf {@link IgxButtonGroupComponent}
      * ```typescript
      *@ViewChild("MyChild")
      *private buttonG: IgxButtonGroupComponent;
@@ -335,6 +334,7 @@ export class IgxButtonGroupComponent extends DisplayDensityBase implements After
      *    this.cdr.detectChanges();
      *}
      * ```
+     * @memberOf {@link IgxButtonGroupComponent}
      */
     public deselectButton(index: number) {
         if (index >= this.buttons.length || index < 0) {

projects/igniteui-angular/src/lib/combo/combo.component.html

@@ -24,7 +24,7 @@
     <ng-container ngProjectAs="igx-hint, [igxHint]">
             <ng-content select="igx-hint, [igxHint]"></ng-content>
         </ng-container>
-    <input igxInput #comboInput name="comboInput" type="text" [value]="value" readonly [placeholder]="placeholder"
+    <input igxInput #comboInput name="comboInput" type="text" [value]="value" readonly [attr.placeholder]="placeholder"
         [disabled]="disabled" (blur)="onBlur()" />
     <ng-container ngProjectAs="igx-suffix">
         <ng-content select="igx-suffix"></ng-content>
@@ -47,7 +47,7 @@
     <igx-input-group *ngIf="displaySearchInput" [displayDensity]="displayDensity" class="igx-combo__search">
         <input class="igx-combo-input" igxInput #searchInput name="searchInput" autocomplete="off" type="text"
             [(ngModel)]="searchValue" (ngModelChange)="handleInputChange($event)" (keyup)="handleKeyUp($event)"
-            (keydown)="handleKeyDown($event)" (focus)="dropdown.onBlur($event)" [placeholder]="searchPlaceholder"
+            (keydown)="handleKeyDown($event)" (focus)="dropdown.onBlur($event)" [attr.placeholder]="searchPlaceholder"
             aria-autocomplete="both" [attr.aria-owns]="dropdown.id" [attr.aria-labelledby]="ariaLabelledBy" />
     </igx-input-group>
     <ng-container *ngTemplateOutlet="headerTemplate">

projects/igniteui-angular/src/lib/combo/combo.component.ts

@@ -683,7 +683,7 @@ export class IgxComboComponent extends DisplayDensityBase implements IgxComboBas
      * ```
      */
     @Input()
-    public placeholder = '';
+    public placeholder;
 
     /**
      * @hidden @internal

projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss

@@ -12,7 +12,6 @@
 /// @requires --var
 @mixin _excel-filtering($theme, $palette) {
     %grid-excel-filter {
-        height: rem(15px);
         display: block;
     }
 

projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts

@@ -255,6 +255,19 @@ describe('IgxForOf directive -', () => {
             }
         });
 
+        it('should not throw error when itemSize is changed while data is null/undefined.', () => {
+            let errorMessage = '';
+            fix.componentInstance.data = null;
+            fix.detectChanges();
+            try {
+                fix.componentInstance.itemSize = '100px';
+                fix.detectChanges();
+            } catch (ex) {
+                errorMessage = ex.message;
+            }
+            expect(errorMessage).toBe('');
+        });
+
         it('should allow initially undefined value for igxForOf and then detect changes correctly once the value is updated', async () => {
             fix = TestBed.createComponent(VerticalVirtualNoDataComponent);
             expect(() => {

projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts

@@ -423,7 +423,8 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
             }
         }
         const defaultItemSize = 'igxForItemSize';
-        if (defaultItemSize in changes && !changes[defaultItemSize].firstChange && this.igxForScrollOrientation === 'vertical') {
+        if (defaultItemSize in changes && !changes[defaultItemSize].firstChange &&
+            this.igxForScrollOrientation === 'vertical' && this.igxForOf) {
             // handle default item size changed.
             this.initSizesCache(this.igxForOf);
             this._applyChanges();
@@ -443,7 +444,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
             if (changes) {
                 //  re-init cache.
                 if (!this.igxForOf) {
-                    return;
+                    this.igxForOf = [];
                 }
                 this._updateSizeCache();
                 this._zone.run(() => {
@@ -1325,7 +1326,8 @@ export class IgxGridForOfDirective<T> extends IgxForOfDirective<T> implements On
             }
         }
         const defaultItemSize = 'igxForItemSize';
-        if (defaultItemSize in changes && !changes[defaultItemSize].firstChange && this.igxForScrollOrientation === 'vertical') {
+        if (defaultItemSize in changes && !changes[defaultItemSize].firstChange &&
+             this.igxForScrollOrientation === 'vertical' && this.igxForOf) {
             // handle default item size changed.
             this.initSizesCache(this.igxForOf);
         }
@@ -1486,7 +1488,7 @@ export class IgxGridForOfDirective<T> extends IgxForOfDirective<T> implements On
                 this.onDataChanging.emit(args);
                 //  re-init cache.
                 if (!this.igxForOf) {
-                    return;
+                    this.igxForOf = [];
                 }
                 /* we need to reset the master dir if all rows are removed
                 (e.g. because of filtering); if all columns are hidden, rows are

projects/igniteui-angular/src/lib/grids/cell.component.ts

@@ -437,7 +437,10 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
             }
         } else {
             const rowTransaction: State = this.grid.transactions.getState(this.row.rowID);
-            return rowTransaction && rowTransaction.value && rowTransaction.value[this.column.field];
+                return rowTransaction && rowTransaction.value &&
+                (rowTransaction.value[this.column.field] ||
+                 rowTransaction.value[this.column.field] === 0 ||
+                 rowTransaction.value[this.column.field] === false);
         }
 
         return false;

projects/igniteui-angular/src/lib/grids/column.component.ts

@@ -616,7 +616,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy {
     /**
      * Gets the column `sortStrategy`.
      * ```typescript
-     * let sortStrategy = this.column.sortStrategy'
+     * let sortStrategy = this.column.sortStrategy
      * ```
      * @memberof IgxColumnComponent
      */
@@ -628,10 +628,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy {
      * Sets the column `sortStrategy`.
      * ```typescript
      * this.column.sortStrategy = new CustomSortingStrategy().
-     *
-     * class CustomSortingStrategy extends SortingStrategy {
-     * ...
-     * }
+     * class CustomSortingStrategy extends SortingStrategy {...}
      * ```
      * @memberof IgxColumnComponent
      */
@@ -1557,7 +1554,6 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy {
      * Autosize the column to the longest currently visible cell value, including the header cell.
      * ```typescript
      * @ViewChild('grid') grid: IgxGridComponent;
-     *
      * let column = this.grid.columnList.filter(c => c.field === 'ID')[0];
      * column.autosize();
      * ```

projects/igniteui-angular/src/lib/grids/filtering/excel-style/grid.excel-style-filtering.component.ts

@@ -14,10 +14,10 @@ import {
 import {
     HorizontalAlignment,
     VerticalAlignment,
-    ConnectedPositioningStrategy,
     OverlaySettings,
     IgxOverlayService,
-    AbsoluteScrollStrategy
+    AbsoluteScrollStrategy,
+    AutoPositionStrategy
 } from '../../../services/index';
 import { IgxFilteringService, ExpressionUI } from '../grid-filtering.service';
 import { IgxToggleDirective } from '../../../directives/toggle/toggle.directive';
@@ -115,7 +115,7 @@ export class IgxGridExcelStyleFilteringComponent implements OnDestroy, OnInit, A
     private _subMenuOverlaySettings: OverlaySettings = {
         closeOnOutsideClick: true,
         modal: false,
-        positionStrategy: new ConnectedPositioningStrategy(this._subMenuPositionSettings),
+        positionStrategy: new AutoPositionStrategy(this._subMenuPositionSettings),
         scrollStrategy: new AbsoluteScrollStrategy()
     };
 

projects/igniteui-angular/src/lib/grids/grid-base.component.ts

@@ -445,7 +445,14 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
 
     /**
      * Sets the current page index.
+     * ```html
      * <igx-grid #grid [data]="Data" [paging]="true" [page]="5" [autoGenerate]="true"></igx-grid>
+     *```
+     * Two-way data binding.
+     * ```html
+     * <igx-grid #grid [data]="Data" [paging]="true" [(page)]="model.page" [autoGenerate]="true"></igx-grid>
+     * ```
+	 * @memberof IgxGridBaseComponent
      */
     set page(val: number) {
         if (val === this._page || val < 0 || val > this.totalPages - 1) {
@@ -2017,7 +2024,8 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
      * for the built-in column hiding UI of the`IgxColumnComponent`.
      * ```typescript
      * const hiddenColText = this.grid.hiddenColumnsText;
-     * ``
+     * ```
+	 * @memberof IgxGridBaseComponent
      */
     @WatchChanges()
     @Input()
@@ -3845,7 +3853,7 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
      * Returns how many times the grid contains the string.
      * ```typescript
      * this.grid.findPrev("financial");
-     * ````
+     * ```
      * @param text the string to search.
      * @param caseSensitive optionally, if the search should be case sensitive (defaults to false).
      * @param exactMatch optionally, if the text should match the entire value (defaults to false).