我在ngFor语句中有子组件 . FirstLoginComponent是父组件 . 哪个团体 .
export class FirstLoginComponent implements OnInit, OnDestroy {
isLoading: boolean;
Groups: Group[];
constructor(
public oidcSecurityService: OidcSecurityService,
private router: Router,
private firstLoginService: FirstLoginService
) {
}
ngOnInit(): void {
this.getData();
console.log(this.isLoading);
}
ngOnDestroy(): void {
console.log("FirstLogin Destroyed");
}
//...
private getData() {
this.firstLoginService.GetIndex()
.subscribe(data => this.Groups = data.Groups,
error => this.oidcSecurityService.handleError(error),
() => console.log(this.Groups));
}}
我有一个名为GroupComponent的子组件
export class GroupComponent implements OnInit, OnDestroy {
@Input() group: Group;
isLoading: boolean;
constructor(public groupService: GroupService) {
}
ngOnInit(): void {
}
public joinGroup() : void {
console.log("dd");
this.groupService.joinGroup(this.group.id);
}
ngOnDestroy(): void {
console.log(this.group);
}
//...
public getGroup() {
return this.group;
}
public leaveGroup(): void {
console.log("dd");
this.groupService.leaveGroup(this.group.id);
}}
我的FirstLoginComponent模板是
<ul>
<li *ngFor="let group of Groups; let i = index">
<group-partial [group] ="group"></group-partial>
</li>
和我的GroupComponent模板是
<div>
<img [src]="group.imageUrl" />
<h3>{{group.Name}}</h3>
<h5>{{group.Id}}</h5>
<button *ngIf="!group.isFollowing" id="#joinButton" (onClick)="joinGroup()">Join</button>
<button *ngIf="group.isFollowing" id="#leaveButton" (onClick)="leaveGroup()">LEleave</button>
我可以从API获取数据作为Observable(any)数据类型 . 组正确显示但是,当我点击“加入”按钮时没有任何反应 . 我甚至无法登录到控制台 .
1 回答
根据你的代码,你正在使用
(onClick)
,正确的是使用(click)
这可以在这里找到的官方文档中看到:https://angular.io/guide/user-input