Closed david-quadpro closed 7 years ago
Update 1: I think the crash error is due to the array having less than 2 items in at time of loading.
Hey @david-quadpro , something in your constructor does not look correct. You have this.dropdownlistSiteDropDown.items$ = new Observable(Object)
, but what is this object? I suggest you start with a local mock object array to see that your other code set up works, and once you have it working to link the Telerik Platform code.
Hi @PeterStaev,
I have done the following successfully:
I am quite new to angular / NativeScript / typescript so I am not 100% sure what you mean by a local mock object array. Please can you clarify.
David
@david-quadpro , I meant to create a local observable eliminating the services like so: https://angular-2-training-book.rangle.io/handout/observables/using_observables.html and then trying to bind the drop down to that.
No further response so closing this one for now. In case you still have problems, please reopen and provide more details.
Hi Peter,
This is probably my lack of understanding, so sorry for asking, but I cannot get the DropDown to work with data returned from Everlive (Telerik MBaaS).
I have component.html:
<DropDown col="1" #dd backroundColor="red" [items]="dropdownlistSiteDropDown.items$ | async" [selectedIndex]="selectedIndex" (selectedIndexChanged)="onchange($event)" (opened)="onopen()" row="0" colSpan="2"> </DropDown>
<!-- <ListPicker col="1" class="input" [items]="dropdownlistSiteDropDown.items$ | async" #dropdownlistSite (selectedIndexChange)="onSelectedPickerChanged(dropdownlistSite, 'dropdownlistSiteDropDown', 'Site')" [selectedIndex]="dropdownlistSiteDropDown.index"></ListPicker> -->
and component.ts:dropdownlistSiteDropDown: any = new Object();
constructor() {
this.dropdownlistSiteDropDown.items$ = new Observable(Object);
this.dropdownlistSiteDropDown.itemsIndicators = new Array<Object>();
}
ngOnInit() {
this.dropdownlistSiteDropDown.items$ = this.service.getDbCollection('Site').map(data => data.sort(this.sortName).map((item, index) => {
if (this.item.data.Site === item.Id) {
this.dropdownlistSiteDropDown.index = index;
}
this.dropdownlistSiteDropDown.itemsIndicators.push(item.Id);
return item.Name;
}));
}
and service.ts:
getDbCollection(dbName: String): Observable<any> {
let db = new Everlive().data(dbName);
let promise: Promise<any> = new Promise(
(resolve, reject) => {
db
.get()
.then(data => resolve(data.result || []))
.catch(error => reject(error));
}
);
return Observable.fromPromise(promise);
}
When I load the view I get: An uncaught Exception occurred on "main" thread. com.tns.NativeScriptException: Calling js method onClick failed
[object Object] File: "file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/rxjs/Subscriber.js, line: 227, column: 12
StackTrace: Frame: function:'SafeSubscriber.__tryOrUnsub', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/rxjs/Subscriber.js', line: 227, column: 13 Frame: function:'SafeSubscriber.next', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/rxjs/Subscriber.js', line: 172, column: 22 Frame: function:'Subscriber._next', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/rxjs/Subscriber.js', line: 125, column: 26 Frame: function:'Subscriber.next', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/rxjs/Subscriber.js', line: 89, column: 18 Frame: function:'Subject.next', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/rxjs/Subject.js', line: 55, column: 25 Frame: function:'EventEmitter.emit', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 4090, column: 80 Frame: function:'NgZone.checkStable', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 4356, column: 44 Frame: function:'NgZone.onLeave', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 4432, column: 18 Frame: function:'onInvoke', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 4394, column: 31 Frame: function:'ZoneDelegate.invoke', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js', line: 189, column: 34 Frame: function:'Zone.run', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js', line: 83, column: 43 Frame: function:'NgZone.run', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 4260, column: 66 Frame: function:'zonedCallback', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/nativescript-angular/renderer.js', line: 212, column: 24 Frame: function:'Observable.notify', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/tns-core-modules/data/observable/observable.js', line: 149, column: 23 Frame: function:'Observable._emit', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/tns-core-modules/data/observable/observable.js', line: 168, column: 18 Frame: function:'onClick', file:'file:///data/data/com.quadpro.qplusrequest/files/app/tns_modules/tns-core-modules/ui/button/button.js', line: 35, column: 32
Any pointers?
Thanks in advance and sorry for asking what it a newbie question that I am sure is entirely my fault,
David