Angular2网页未加载

问题描述 投票:0回答:1

我的Angular2网页不再加载。一切都工作正常,然后我保存了一些代码后,页面将无法加载。

我试图在我的代码中检查错误并修复它们,但我的网页仍然无法加载。

courses.component.ts

import {CourseService} from './course.service'

@Component({
    selector: 'courses',
    template: ` 
    <h2> Courses </h2>
    {{title}}
    <ul>
        <li *ngFor = "#course of courses">
        {{course}}
        </li>
    </ul>

    ` ,
    providers: [CourseService]
    // we use the backtick "`" to breakup the template into multiple lines
      // to render the title we used double curly braces also known as "interpolation"
})

export class CoursesComponent {

    // this is a module. It'll be able to be imported to other places

    title: string = "The title of the courses page";

    courses =["Course1", "Course2", "Course3"];

    constructor(courseService: CourseService) {

        this.courses = courseService.getCourses();
    }

}```

--course.service.ts--
```export class CourseService {

    getCourses() : string[] {
        return ["Course1","Course2", "Course3"];
        // this is a service class created to be used with our component
    }
}```
import {Component} from 'angular2/core';
import {CoursesComponent} from './courses.component'

@Component({
    selector: 'my-app',
    template: '<h1>My Hello Angular</h1><courses></courses>',
    directives: [CoursesComponent]
})

**app.component.ts**
```export class AppComponent { 
// the app component is the root of your application
// it controls the entire app/page

}```

Please excuse my formatting is it is not correct. Does anyone know what may be causing my web-page to no longer load?
angular typescript visual-studio-code lite-server
1个回答
0
投票

带#的“#course”语法是我以前没见过的语法。尝试改为:

<li *ngFor="let course of courses">
    {{course}}
</li>
© www.soinside.com 2019 - 2024. All rights reserved.