Fixing issues in base property copying and handling dataSource change for combo.

Author: MayaKirova

samples/igGrid-TopLevelOpts/igGrid-TopLevelOptsTemplate.html

@@ -8,7 +8,7 @@
 			[height]='h'
 			[autoGenerateColumns]='false'
 			[columns]='cols'
-			[primaryKey]='"key"'
+			[primaryKey]='pKey'
 		></ig-grid>
 	</div>
 </div>

src/igcombo/igcombo.component.ts

@@ -79,8 +79,11 @@ export class IgComboComponent extends IgControlBase<IgCombo> implements ControlV
 	}
 
 	dataSourceApplyChanges(changes) {
+		//dataSource has changed.
 		const element = jQuery(this._el);
-		element.data("igCombo").dataBind();
+		if (element[this._widgetName]) {
+			element[this._widgetName]("option", "dataSource", this.dataSource);
+		}
 		if (this.model && this.model.value) {
 			this.writeValue(this.model.value);
 		}
@@ -103,9 +106,9 @@ export class IgComboComponent extends IgControlBase<IgCombo> implements ControlV
                 try {
                     this._differ = this._differs.find(value).create();
 					this._changes = [];
-					for(var i=0; i < this.dataSource.length; i++){
+					for (var i=0; i < this.dataSource.length; i++) {
 						this._changes.push(this.kvalDiffers.find({}).create());	
-					}					
+					}
                 }
 				catch(e){
 					throw new Error("Only binding to arrays is supported.");

src/igcontrolbase/igcontrolbase.ts

@@ -94,24 +94,37 @@ export class IgControlBase<Model> implements DoCheck {
 
 	ngOnInit() {
 		var evtName;
+		let that = this;
 		this._events = new Map<string, string>();
 
 		for (var opt in jQuery.ui[this._widgetName].prototype.options) {
 			//copy root level options into this.options
-			if(this[opt]){
+			if(this[opt] && typeof this[opt] !== "function"){
 				this.options[opt] = this[opt];
 			}
-			if(opt !== "dataSource") {			
-				Object.defineProperty(this, opt, {
-					set: this.createSetter(opt),
-					enumerable: true,
-					configurable: true
-				});
-			}
 		}
-		//events binding
-		let that = this;
 
+		for (var opt in jQuery.ui[this._widgetName].prototype.options) {
+		 	if(opt !== "dataSource") {			
+		  		Object.defineProperty(this, opt, {
+		  			set: this.createSetter(opt),
+		  			enumerable: true,
+		  			configurable: true
+		  		});
+		  	}
+		}
+
+		var propNames = Object.getOwnPropertyNames(jQuery.ui[this._widgetName].prototype);
+		for(var i = 0; i < propNames.length; i++) {
+		var name = propNames[i];
+		 	if(name.indexOf("_") !== 0 && typeof jQuery.ui[this._widgetName].prototype[name] === "function"
+		 	&& name !== "dataSource"){
+		 		Object.defineProperty(that, name, {
+		 			get: that.createMethodGetter(name)
+		 		});
+		 	}
+		 }
+		//events binding
 		for (var propt in jQuery.ui[this._widgetName].prototype.events) {
 			evtName = this._widgetName.toLowerCase() + propt.toLowerCase();
 			this._events[evtName] = propt;
@@ -120,16 +133,6 @@ export class IgControlBase<Model> implements DoCheck {
 				emmiter.emit({ event: evt, ui: ui });
 			});
 		}
-		var propNames = Object.getOwnPropertyNames(jQuery.ui[this._widgetName].prototype);
-		for(var i = 0; i < propNames.length; i++) {
-			var name = propNames[i];
-			if(name.indexOf("_") !== 0 && typeof jQuery.ui[this._widgetName].prototype[name] === "function"
-			&& name !== "dataSource"){
-				Object.defineProperty(that, name, {
-					get: that.createMethodGetter(name)
-				});
-			}
-		}		
 
 		if (this.changeDetectionInterval === undefined || this.changeDetectionInterval === null) {
 			this.changeDetectionInterval = 500;

tests/unit/igcombo/combo.spec.ts

@@ -190,6 +190,7 @@ export function main() {
             });
             TestBed.compileComponents().then(() => {
                 let fixture = TestBed.createComponent(TestComponent);
+                fixture.detectChanges();
                 fixture.componentInstance.data = fixture.componentInstance.northwind;
                 setTimeout(function () {
                     fixture.detectChanges();