okay, Dropdown works, just forgot to include the directive.
AutoComplete still does not.
I'm running several gulp tasks to embed the templates e.g. - but they are correct and I just tried it manually with templateUrl instead - no luck.
Do suggestions and ngModel properties have to be in a specific format, e.g. have a value property or something like that? can they be null/undefined at the beginning or do they have to be an empty object?
Code: Select all
<p-autoComplete [(ngModel)]="adresse" [suggestions]="adressen" (completeMethod)="search($event)" field="Name"></p-autoComplete>
adresse is of type Adresse (see code above) and is now undefined at the beginning. adressen is of type Adresse[] and undefined, too. 'Name' is a property of Adresse.
EDIT:
this is the final JavaScript file after the gulp tasks:
Code: Select all
System.register(['@angular/core', '../../../common/api-service', 'primeng/primeng'], function(exports_1, context_1) {
"use strict";
var __moduleName = context_1 && context_1.id;
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1, api_service_1, primeng_1;
var SettingsUserComponent;
return {
setters:[
function (core_1_1) {
core_1 = core_1_1;
},
function (api_service_1_1) {
api_service_1 = api_service_1_1;
},
function (primeng_1_1) {
primeng_1 = primeng_1_1;
}],
execute: function() {
SettingsUserComponent = (function () {
function SettingsUserComponent(apiService) {
this.apiService = apiService;
}
SettingsUserComponent.prototype.search = function (query) {
var _this = this;
console.log('Suche:', query);
this.apiService.getAdressenByName(query)
.subscribe(function (res) {
if (res) {
console.log('Ergebnisse:', res);
_this.adressen = res;
}
}, function (err) {
console.log(err);
});
};
SettingsUserComponent = __decorate([
core_1.Component({
selector: 'settings-user',
template: '<p-autocomplete [(ngModel)]="adresse" [suggestions]="adressen" (completeMethod)="search($event)" field="Name"></p-autocomplete>',
styles: [''],
directives: [primeng_1.AutoComplete]
}),
__metadata('design:paramtypes', [api_service_1.APIService])
], SettingsUserComponent);
return SettingsUserComponent;
}());
exports_1("SettingsUserComponent", SettingsUserComponent);
}
}
});
Chrome DevTools say that the error occurs in:
Code: Select all
Error: No value accessor for ''
at new BaseException (exceptions.ts:14)
at _throwError (shared.ts:61)
at Object.setUpControl (shared.ts:33)
at NgModel.ngOnChanges (ng_model.ts:51)
at DebugAppView._View_SettingsUserComponent0.detectChangesInternal (SettingsUserComponent.template.js:61)
which is here (at line "if ((changes !== null)) { self._NgModel_0_3.ngOnChanges(changes); }"):
Code: Select all
(function(jit_StaticNodeDebugInfo0,jit_NgModel1,jit_NgControl2,jit_NgControlStatus3,jit_DebugAppView4,jit_ViewType_COMPONENT5,jit_ChangeDetectionStrategy_CheckAlways6,jit_uninitialized7,jit_checkBinding8,jit_SimpleChange9,jit_ViewEncapsulation_Emulated10,jit_val11
/**/) {
var nodeDebugInfos_SettingsUserComponent0 = [new jit_StaticNodeDebugInfo0([
jit_NgModel1,
jit_NgControl2,
jit_NgControlStatus3
]
,null,{})];
var renderType_SettingsUserComponent = null;
function _View_SettingsUserComponent0(viewUtils,parentInjector,declarationEl) {
var self = this;
jit_DebugAppView4.call(this, _View_SettingsUserComponent0,renderType_SettingsUserComponent,jit_ViewType_COMPONENT5,viewUtils,parentInjector,declarationEl,jit_ChangeDetectionStrategy_CheckAlways6,nodeDebugInfos_SettingsUserComponent0);
}
_View_SettingsUserComponent0.prototype = Object.create(jit_DebugAppView4.prototype);
_View_SettingsUserComponent0.prototype.createInternal = function(rootSelector) {
var self = this;
var parentRenderNode = self.renderer.createViewRoot(self.declarationAppElement.nativeElement);
self._el_0 = self.renderer.createElement(parentRenderNode,'p-autocomplete',self.debug(0,0,0));
self.renderer.setElementAttribute(self._el_0,'field','Name');
self._NgModel_0_3 = new jit_NgModel1(null,null,null);
self._NgControl_0_4 = self._NgModel_0_3;
self._NgControlStatus_0_5 = new jit_NgControlStatus3(self._NgControl_0_4);
self._expr_2 = jit_uninitialized7;
var disposable_0 = self.renderer.listen(self._el_0,'ngModelChange',self.eventHandler(self._handle_ngModelChange_0_0.bind(self)));
var disposable_1 = self.renderer.listen(self._el_0,'completeMethod',self.eventHandler(self._handle_completeMethod_0_1.bind(self)));
self._expr_3 = jit_uninitialized7;
var subscription_0 = self._NgModel_0_3.update.subscribe(self.eventHandler(self._handle_ngModelChange_0_0.bind(self)));
self._expr_4 = jit_uninitialized7;
self._expr_5 = jit_uninitialized7;
self._expr_6 = jit_uninitialized7;
self._expr_7 = jit_uninitialized7;
self._expr_8 = jit_uninitialized7;
self._expr_9 = jit_uninitialized7;
self.init([],[self._el_0],[
disposable_0,
disposable_1
]
,[subscription_0]);
return null;
};
_View_SettingsUserComponent0.prototype.injectorGetInternal = function(token,requestNodeIndex,notFoundResult) {
var self = this;
if (((token === jit_NgModel1) && (0 === requestNodeIndex))) { return self._NgModel_0_3; }
if (((token === jit_NgControl2) && (0 === requestNodeIndex))) { return self._NgControl_0_4; }
if (((token === jit_NgControlStatus3) && (0 === requestNodeIndex))) { return self._NgControlStatus_0_5; }
return notFoundResult;
};
_View_SettingsUserComponent0.prototype.detectChangesInternal = function(throwOnChange) {
var self = this;
var changes = null;
self.debug(0,0,0);
changes = null;
self.debug(0,0,16);
var currVal_3 = self.context.adresse;
if (jit_checkBinding8(throwOnChange,self._expr_3,currVal_3)) {
self._NgModel_0_3.model = currVal_3;
if ((changes === null)) { (changes = {}); }
changes['model'] = new jit_SimpleChange9(self._expr_3,currVal_3);
self._expr_3 = currVal_3;
}
if ((changes !== null)) { self._NgModel_0_3.ngOnChanges(changes); }
self.detectContentChildrenChanges(throwOnChange);
self.debug(0,0,38);
var currVal_2 = self.context.adressen;
if (jit_checkBinding8(throwOnChange,self._expr_2,currVal_2)) {
self.renderer.setElementProperty(self._el_0,'suggestions',currVal_2);
self._expr_2 = currVal_2;
}
self.debug(0,0,0);
var currVal_4 = self._NgControlStatus_0_5.ngClassUntouched;
if (jit_checkBinding8(throwOnChange,self._expr_4,currVal_4)) {
self.renderer.setElementClass(self._el_0,'ng-untouched',currVal_4);
self._expr_4 = currVal_4;
}
self.debug(0,0,0);
var currVal_5 = self._NgControlStatus_0_5.ngClassTouched;
if (jit_checkBinding8(throwOnChange,self._expr_5,currVal_5)) {
self.renderer.setElementClass(self._el_0,'ng-touched',currVal_5);
self._expr_5 = currVal_5;
}
self.debug(0,0,0);
var currVal_6 = self._NgControlStatus_0_5.ngClassPristine;
if (jit_checkBinding8(throwOnChange,self._expr_6,currVal_6)) {
self.renderer.setElementClass(self._el_0,'ng-pristine',currVal_6);
self._expr_6 = currVal_6;
}
self.debug(0,0,0);
var currVal_7 = self._NgControlStatus_0_5.ngClassDirty;
if (jit_checkBinding8(throwOnChange,self._expr_7,currVal_7)) {
self.renderer.setElementClass(self._el_0,'ng-dirty',currVal_7);
self._expr_7 = currVal_7;
}
self.debug(0,0,0);
var currVal_8 = self._NgControlStatus_0_5.ngClassValid;
if (jit_checkBinding8(throwOnChange,self._expr_8,currVal_8)) {
self.renderer.setElementClass(self._el_0,'ng-valid',currVal_8);
self._expr_8 = currVal_8;
}
self.debug(0,0,0);
var currVal_9 = self._NgControlStatus_0_5.ngClassInvalid;
if (jit_checkBinding8(throwOnChange,self._expr_9,currVal_9)) {
self.renderer.setElementClass(self._el_0,'ng-invalid',currVal_9);
self._expr_9 = currVal_9;
}
self.detectViewChildrenChanges(throwOnChange);
};
_View_SettingsUserComponent0.prototype._handle_ngModelChange_0_0 = function($event) {
var self = this;
self.markPathToRootAsCheckOnce();
self.debug(0,0,16);
var pd_0 = ((self.context.adresse = $event) !== false);
return (true && pd_0);
};
_View_SettingsUserComponent0.prototype._handle_completeMethod_0_1 = function($event) {
var self = this;
self.markPathToRootAsCheckOnce();
self.debug(0,0,63);
var pd_0 = (self.context.search($event) !== false);
return (true && pd_0);
};
function viewFactory_SettingsUserComponent0(viewUtils,parentInjector,declarationEl) {
if ((renderType_SettingsUserComponent === null)) { (renderType_SettingsUserComponent = viewUtils.createRenderComponentType('./SettingsUserComponent class SettingsUserComponent - inline template',0,jit_ViewEncapsulation_Emulated10,jit_val11)); }
return new _View_SettingsUserComponent0(viewUtils,parentInjector,declarationEl);
}
return viewFactory_SettingsUserComponent0
})
any ideas?