首页 > 解决方案 > Angular2网页未加载

问题描述

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

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

课程.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?

标签: angulartypescriptvisual-studio-codelite-server

解决方案


带有# 的“#course”语法是我以前从未见过的语法。尝试这样做:

<li *ngFor="let course of courses">
    {{course}}
</li>

推荐阅读