self.context不是一个函数

时间:2017-02-02 13:12:56

标签: angular angular-components

我正在尝试从我的模板中调用此函数domain,但收到self.context.article.domain is not a function错误。尝试在SO上查看其他答案,但无法解决问题。

这是我的组件 -

import { Component,Input } from '@angular/core';
import {Article} from './Article'

@Component({
  selector:'article-art',

  template:`<div class="container">
    <div class="row">
      <section class="col-sm-4 col-md-4 col-xs-4 left">
        <div class="value">{{article.votes}}</div>
        <div class="label">Points</div>
      </section>
      <section class="col-sm-8 col-md-8 col-xs-8 right">
        <a class="ui large header" href="{{ article.link }}">
          {{ article.title }}
        </a>
        <div class="meta">({{ article.domain() }})</div>
        <ul>
          <li><a href (click)="voteUp()"><i class="glyphicon glyphicon-arrow-up"></i>Upvote</a></li>
          <li><a href (click)="voteDown()"><i class="glyphicon glyphicon-arrow-down"></i>DownVote</a></li>
        </ul>
      </section>
    </div>
  </div>`,
  styleUrls:['src/article.cmponent.css']
})

export class ArticleComponent{
  @Input() article:Article;

  voteUp(){
    this.article.voteUp();
    return false;
  }

  voteDown(){
    this.article.voteDown();
    return false;
  }
  domain(): string {
 try {
 const link: string = this.link.split('//')[1];
 console.log(link);
 return link.split('/')[0];
 } catch (err) {
 return null;
 }
 }
}

还在plunker中附加了复制的问题:https://plnkr.co/edit/tu7YImvsMjpWyrmjq2M2?p=preview。 您可以在控制台中看到错误。

感谢您提供帮助。

1 个答案:

答案 0 :(得分:2)

您获得self.context.article.domain is not a function因为domain课程中没有名为Article的功能。将domain函数添加到Article类,它应该按预期工作。