Angular 2单击事件不起作用?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (191)

我有一个web项目并使用angular 2我的不同页面使用click事件没有任何问题但是新页面创建然后click事件在新页面中出错。

这个错误

TypeError:self.parentView.parentView.context.changedItem不是View_SiteConfig3.handleEvent_0(/AppModule/SiteConfig/component.ngfactory.js:137)中的函数,位于HTMLTextAreaElement.eval的View_SiteConfig3.eval(core.umd.js:12399) (platform-b​​rowser.umd.js:3223)位于Zone.leInvokeTask(zone.js:265)的ZoneDelegate.invokeTask(zone.js:265),位于Zone.runTask的ZoneDelegate.invokeTask(zone.js:264) (zone.js:154)在HTMLTextAreaElement.ZoneTask.invoke(zone.js:335)

网站config.html

<div *ngFor="let item of items1; let i = index;" class="col-sm-4">
    <button (click)="changedItem(item)">Test</button>
</div>

网站config.ts

import { Component, OnInit } from '@angular/core'
import { Http } from '@angular/http'

@Component({
    selector: 'site-config',
    moduleId: module.id,
    templateUrl: '/site-config.html'
})
export class SiteConfig implements OnInit {

    items1: number[] = [1,2,3]

    ngOnInit(): void {
    }

    public changedItem(item) {
        //My Codes This Here
    }

    constructor(private http: Http) {
    }
}

编辑:解决这个问题的方法;

我的项目奏效了。问题是ts文件未编译然后给出“不是函数”错误

提问于
用户回答回答于

也许这是你没有提供的一段代码的错误。

我重现你的代码:

风景:

<pre *ngIf="current">{{current}}</pre>
<div *ngFor="let item of items1; let i = index;" class="col-sm-4">
  <button (click)="changedItem(item)">Test</button>
</div> 

课程内容:

items1: number[] = [1,2,3]

current: number;

ngOnInit() {
}

public changedItem(item) {
    this.current = item;
}

constructor() {
}

这是一个有效的Plunkr:https://plnkr.co/edit/ZGI1FNB8RWN9BnnPnKgJ p = preview

你能提供更多代码吗?

用户回答回答于

尝试这个:

网站config.html

<div *ngFor="let item of items1; let i = index;" class="col-sm-4">
    <button type="button" (click)="changedItem($event, item)">Test</button> <!-- add type="button" -->
</div>

网站config.ts

import { Component, OnInit } from '@angular/core'
import { Http } from '@angular/http'

@Component({
    selector: 'site-config',
    moduleId: module.id,
    templateUrl: '/site-config.html'
})
export class SiteConfig implements OnInit {

    items1: number[] = [1,2,3]

    ngOnInit(): void {
    }

    public changedItem(event: any, item: number) {
        event.preventDefault();
        //Your code...
    }

    constructor(private http: Http) {
    }
}

扫码关注云+社区

领取腾讯云代金券