【问题标题】:Angular2 Web-Page Not LoadingAngular2网页未加载
【发布时间】:2019-09-19 05:58:02
【问题描述】:

我的 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?

【问题讨论】:

  • 为什么你在这行的课程前有#:"
  • "?也许这是你的问题。
  • 我相信#号表示我会重复使用该变量
  • 你能设置一个stackblitz example 让我们看看发生了什么吗?是否有任何控制台错误?
  • 标签: angular typescript visual-studio-code lite-server


    【解决方案1】:

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

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

    【讨论】:

      猜你喜欢
      相关资源
      最近更新 更多
      热门标签