我遇到了一个问题,当我尝试在 angular 2 内使用 angularJS 组件时,在UpgradeComponent.initializeBindings
遇到此错误的方法期间:
at Function.keys (<anonymous>)
at AsItemListSmallDirective.UpgradeComponent.initializeBindings (static.js?85d2:1455)
at AsItemListSmallDirective.UpgradeComponent (static.js?85d2:1361)
at new AsItemListSmallDirective (as-item-list-small.directive.ts?5b28:67)
at createClass (core.js?4dd3:22151)
at createDirectiveInstance (core.js?4dd3:22028)
at createViewNodes (core.js?4dd3:23254)
at callViewAction (core.js?4dd3:23570)
at execComponentViewsAction (core.js?4dd3:23489)
at createViewNodes (core.js?4dd3:23282)
我相信它可能正在尝试在 Angular 中构建组件,但是从 angularJS 代码复制绑定时遇到了问题。我在下面包含了我的 JS 组件定义,有人可以提供任何帮助吗?
import { Directive, ElementRef, Injector, Input, Output } from '@angular/core';
import { UpgradeComponent } from '@angular/upgrade/static';
import { EventEmitter } from 'events';
@Directive({
selector: 'as-item-list-small'
})
export class AsItemListSmallDirective extends UpgradeComponent {
@Input()
products: any[];
@Input()
stores: any[];
@Input()
metrics: any[];
@Input()
attributes: any[];
@Input()
productsTitle: string;
@Input()
storesTitle: string;
@Input()
metricsTitle: string;
@Input()
attributesTitle: string;
@Input()
limitTo: number;
@Input()
showRemove: boolean;
@Input()
showRemoveAll: boolean;
@Input()
showBorder: boolean;
@Input()
noHover: any;
@Output()
onRemove: EventEmitter = new EventEmitter();
@Output()
onRemoveDone: EventEmitter = new EventEmitter();
@Input()
selectionMaxHeight: number;
@Input()
isDisabled: boolean;
constructor(elementRef: ElementRef, injector: Injector) {
super('asItemListSmall', elementRef, injector);
}
}
export function AsItemListSmall() {
return {
restrict: 'E',
bindToController: {
products: '=',
stores: '=',
metrics: '=',
attributes: '=',
productsTitle: '@',
storesTitle: '@',
metricsTitle: '@',
attributesTitle: '@',
limitTo: '=?',
showRemove: '=?',
showRemoveAll: '=?',
showBorder: '=?',
noHover: '=?',
onRemove: '&?',
onRemoveDone: '&?',
selectionMaxHeight: '@',
isDisabled: '=?'
},
template: require('./as-item-list-small.directive.html'),
controller: AsItemListSmallController,
controllerAs: '$ctrl'
};
}