Angular2英雄教程 - 英雄课

在英雄课暂时存储在app.component.ts的部分，我不确定在哪里粘贴下面的脚本，它说我们必须重构。Angular2英雄教程 - 英雄课

英雄：英雄= { id：1, name：'Windstorm' };

把它放在app.component.ts文件中会出现错误。在最终版本中，这个类似乎是一个独立的文件，但现在，我应该能够在Chrome中看到英雄的名字，而它仍然在app.component.ts中。帮帮我？

编辑：这里是整个代码。

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

export class Hero { 
    id: number; 
    name: string; 
} 

hero: Hero = { 
    id: 1, 
    name: 'Windstorm' 
}; 

@Component({ 
    selector: 'my-app', 
    template: '<h1>{{title}}</h1><h2>{{hero.name}} details!</h2>' 
}) 

export class AppComponent `enter code here`{ 
    title = 'Tour of Heroes'; 
    hero = 'Windstorm'; 
}

来源

2016-09-22 el_kraken

这可能会有助于发布您收到的错误。 – user2263572

TS 错误未使用label.at 8号线第1个栏 TS 错误分配expression.at线无效的左侧8第7栏 –

您的代码有两个问题。第一个是你在课堂外定义了hero，另一个是hero = 'Windstorm'。你的课应该是这样的：

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

export class Hero { 
    id: number; 
    name: string; 
} 

@Component({ 
    selector: 'my-app', 
    template: '<h1>{{title}}</h1><h2>{{hero.name}} details!</h2>' 
}) 
export class AppComponent { 
    hero: Hero = { 
     id: 1, 
     name: 'Windstorm' 
    }; 

    title = 'Tour of Heroes'; 
}

这应该会使它工作。您最初为某个属性hero指定了一个字符串，使其隐含为字符串类型，但您可以呼叫hero.name预期它是Hero类型的对象。

来源

2016-09-22 08:02:25

谢谢。我认为这是有效的。我同意，我发现英雄属性是奇怪的原始教程。 –

是什么让我失望的是来自Angular 2教程：“现在我们有一个英雄类，让我们重构我们的组件的英雄属性是英雄类型。然后初始化为ID为1，名称为“Windstorm”。“我不确定”重构“是什么意思 –

当您到达开发中的某个点时，您需要重新组织和重新排列代码，逻辑或组织类型并注入文件，这是关于重构的一个广泛的解释。 –

我不确定这是正确的答案，但我现在坚持使用它。我发现这个教程的复制并不奏效，但从它的一瞥中，教程希望我做的事情没有任何意义。根据我对Typescript的有限了解，请参阅下面的修订。这是唯一有意义的，因为1）导出类英雄在本教程中建议的文档中没有意义，声明变量英雄需要“let”并且2）必须修改导出AppComponent参数。

从'@ angular/core'导入{Component};

let hero = { 
    id: 1, 
    name: 'Windstorm' 
}; 

@Component({ 
    selector: 'my-app', 
    template: '<h1>{{title}}</h1><h2>{{hero}} details!</h2>' 
}) 

export class AppComponent { 
    title = 'Tour of Heroes'; 
    hero = hero.name; 
}

来源

2016-09-22 02:11:19

你这里的错误是你声明Hero作为一类，你不能动态地创建一个类。

Hero是本教程中的一个界面，可以在运行中创建它。

只需

export interface Hero { 
    id: number; 
    name: string; 
}

更换

export class Hero { 
    id: number; 
    name: string; 
}

，你的代码将工作。因为如果你想使用类来创建一个英雄，你必须这样做：

export class Hero { 
    id: number; 
    name: string; 
} 

let hero:Hero = new Hero(); 
hero.id= 1; 
hero.name="Windstorm";

这里是整个代码：

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

export interface Hero { 
    id: number; 
    name: string; 
} 

hero 

@Component({ 
    selector: 'my-app', 
    template: '<h1>{{title}}</h1><h2>{{hero.name}} details!</h2>' 
}) 

export class AppComponent { 
    title = 'Tour of Heroes'; 
    hero: Hero = { 
     id: 1, 
     name: 'Windstorm' 
    }; 
}

来源

2016-09-22 07:27:04 Supamiu

基本上，你说如果我想创建一个类，我用的是“导出类英雄”并将其放入单独的.ts文件中。如果我想将它内联到app.component.ts中，我将不得不使用“导出界面英雄”？ –

Angular网站上的说明不会制作该课程。它说要创建一个类，但是在“import”行所在的顶部附近的app.component.ts中。我不确定为什么这个教学是这样的。 –

export关键字在这里是可选的，它取决于你想在另一个.ts文件中使用这个元素（可以是一个类，一个接口或一个变量）。我在这里说的是，如果你想按照你在示例中所做的方式声明你的英雄，你需要使用一个接口类型。 – Supamiu

-1

你不需要出口;或你可以创建新的TS文件，并创建新的User类，如：

export class User { 
private name:string 

constructor... 
get && setter here... 

    }

和进口到您的组件文件，构建它

来源

2016-09-22 07:35:32 junk

Angular2英雄教程 - 英雄课

回答

相关问题