使用iron-list时用作弱映射键的值无效

时间:2016-08-04 18:38:14

标签: angular polymer

我正在尝试将Angular 2与Polymer一起使用,当我尝试在组件的HTML模板中使用iron-list并使用静态字符串数组作为测试时,我得到了这个巨大的堆栈跟踪。 enter image description here

在我的组件中,我使用Vaadin的Elements来在Angular 2中使用Polymer元素

import {Component, OnInit} from "@angular/core";
import {PolymerElement} from '@vaadin/angular2-polymer'
import {CoursesService} from '../services/courses.service'

@Component({
    selector: 'courses',
    templateUrl: 'app/templates/courses.component.html',
    directives: [PolymerElement('iron-list'), PolymerElement('iron-ajax')], // Originally tried iron-ajax but didn't pan out so well
    providers: [CoursesService]
})
export class CoursesComponent implements OnInit {
    coursesData;

    constructor(coursesService: CoursesService) {
        this.coursesData = coursesService.getCourses();
    }

    ngOnInit() {
    }
}

我在这个服务中返回一个字符串数组,我试图显示但是抛出错误

import { Injectable } from '@angular/core';

@Injectable()
export class CoursesService {

    constructor() { }

    getCourses() : string[] {
        return ["Course 1", "Course 2", "Course 3"]
    }
} 

然后是组件的模板,我尝试使用与组件TypeScript中的变量相同的变量。

<iron-list items="{{coursesData}}" as="item">
    <template>[[item]]</template>
</iron-list>

0 个答案:

没有答案