【发布时间】：2020-04-09 13:55:44
【问题描述】：
我是 Angular 9 的初学者，我正在尝试创建一个应用程序。但是我有一些关于属性定义的小问题。我希望有人会好心地帮助我。 首先，我的项目是这样的：
我的 app.component.html 被定向到我的管理器文件夹：
<button mat-raised-button id="Upgrade (click)="modal='Managers'">Managers</button>
<app-manager *ngIf="modal=='Managers'" (closemodalevent)="modal=null" [manager]="world.managers.pallier"></app-manager>
我的 app.component.ts：
import { Component, Input } from '@angular/core';
import { RestserviceService } from './restservice.service';
import { World, Product, Pallier } from './world';
import { MatDialogConfig, MatDialog } from '@angular/material/dialog';
import { ModalComponent } from './modal/modal.component';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
products = [
{logo: "./assets/Avatar.jpg" },
{logo: "./assets/Avatar.jpg" },
{logo: "./assets/Avatar.jpg" },
{logo: "./assets/Avatar.jpg" },
{logo: "./assets/Avatar.jpg" },
{logo: "./assets/Avatar.jpg" }
];
title = 'AngularProject';
world: World = new World();
server: String;
qtmulti: number = 1;
modal: string=null;
constructor(private service: RestserviceService) {
this.server = service.getServer();
service.getWorld().then(world => { this.world = world; });
}
}
我的 manager.component.html：
<div class="Modal" (clickOutside)="closemodal()">
<div><h1 class="ManagerTitle">Managers make you feel better !</h1></div>
<div>
<div *ngFor="let manager of world.managers.pallier">
<div *ngIf="!manager.unlocked" class="ManagerLayout">
<div>
<div class="logo"><img class="LogoImage" [attr.src]="server+manager.logo"></div>
</div>
<div>
<div class="ManagerName">{{manager.name}}</div>
<div class="ManagerCible">{{world.products.product[manager.idcible-1].name}}</div>
</div>
<div class="ManagerCost">{{manager.seuil}}</div>
</div>
<button mat-raised-button id="HireButton" (click)="hireManager(manager)"
[ngClass]="{'selectable': (world.money >= manager.seuil)}"> Hire !</button>
</div>
</div>
</div>
我在这里遇到了世界和服务器的错误，即：
未定义标识符“世界”。组件声明、模板变量声明和元素引用不包含这样的成员。
未定义标识符“服务器”。组件声明、模板变量声明和元素引用不包含这样的成员。
但是我已经在 app.component.ts 中定义了服务器和世界...
我提前感谢愿意花时间帮助我的人。
编辑：对不起，我忘了把它放在这里，因为它是一个朋友为我做的.ts
我的 manager.component.ts：
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
import { World, Pallier } from '../world';
@Component({
selector: 'app-manager',
templateUrl: './manager.component.html',
styleUrls: ['./manager.component.css']
})
export class ManagerComponent implements OnInit {
canclose=false;
@Input() manager: Pallier[];
@Output() closemodalevent = new EventEmitter<void>();
constructor() { }
ngOnInit(): void {
}
hireManager(manager : Pallier){
alert(manager.name + 'has been hired')
if (this.world.money >= manager.seuil) {
this.world.money = this.world.money - manager.seuil;
this.world.managers.pallier[this.world.managers.pallier.indexOf(manager)].unlocked = true;
this.world.products.product.forEach(element => {if (manager.idcible == element.id) {this.world.products.product[this.world.products.product.indexOf(element)].managerUnlocked = true;}});
}
}
closemodal(){
console.log(this.canclose);
if(this.canclose){
this.closemodalevent.emit();
}else{
this.canclose=true;
}
}
我的世界.ts：
export class World {
name : string;
logo : string;
money: number;
score: number;
totalangels: number;
activeangels: number;
angelbonus: number;
lastupdate: string;
products : { "product": Product[] };
allunlocks: { "pallier": Pallier[]};
upgrades: { "pallier": Pallier[]};
angelupgrades: { "pallier": Pallier[]};
managers: { "pallier": Pallier[]};
constructor() {
this.products = { "product":[ ] } ;
this.managers = { "pallier":[ ] };
this.upgrades = { "pallier":[ ] };
this.angelupgrades = { "pallier":[ ] };
this.allunlocks = { "pallier":[ ] };
}
}
【问题讨论】：
-
你需要展示
manager.component.ts的内容。world应该在其中声明。 -
显示 manager.component.ts 文件内容。
-
@AzizulHoq 对不起，他们现在在这里 :)
标签： angular typescript