self.context 不是函数

Question

我试图从我的模板中调用此函数 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。您可以在控制台中看到错误。

感谢您对我的帮助。

Answer 1

您得到 self.context.article.domain is not a function，因为 Article class 上没有名为 domain 的函数。将 domain 函数添加到 Article class 中，它应该会按预期工作。

self.context 不是函数

self.context is not a function

angular-components

angular