2017-12-27 839 views
0

做有什么问题没有。在登录到控制台时显示以下错误:角5类型错误:this.tipp.isPersistent不是一个函数

"Tipp: { 
"id":1, 
{...} 
} 

ERROR TypeError: this.tipp.isPersistent is not a function" is shown. 

第一个日志语句显示正确。但它似乎是一个问题,以评估 'this.tipp.isPersistent()':

@Component({ 
    selector: 'tipp-eingabe', 
    templateUrl: './tipp-eingabe.component.html', 
    styleUrls: ['./tipp-eingabe.component.css'], 
    encapsulation: ViewEncapsulation.None 
}) 
export class TippEingabeComponent implements OnChanges { 
    @Input() tipp: Tipp;  
    constructor() { 
    } 

    ngOnChanges(changes) { 
    console.log("Tipp: " + JSON.stringify(this.tipp)); 
    console.log("Tipp-isPersistent: " + this.tipp.isPersistent()); 
    } 
} 

export class Tipp { 
    id: number; 
    spieler: Spieler; 
    spiel: Spiel; 
    tippErgebnis: Spielstand; 
    aenderungsDatum: Date; 

    public isPersistent(): boolean { 
    return true; 
    }; 
} 

通过下面的模板片断叫:

<div class="panel panel-default"> 
    <div class="panel panel-body"> 
    <div *ngFor="let spiel of spiele"> 
     <div *ngIf="!isMatchCollapsed(spiel.id)"> 
     <div *ngFor="let tipp of spiel.tipps" class="tippLine"> 
      <tipp-eingabe [tipp]="tipp"></tipp-eingabe> 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

回答

0

你应该只调用this.isPersistent()

console.log("Tipp-isPersistent: " + this.isPersistent()); 
+0

不起作用:编译失败:“财产‘isPersistent’上不存在型‘TippEingabeComponent’ – user1350889

2

它看起来像您正在创建与的属性的对象而不是创建Tipp的新实例。这意味着您的对象具有Tipp的属性,但不包括方法。

所以在通过TIPP到TippEingabeComponent你父组件,你应该创造Tipp一个新的实例。

let tipp = new Tipp(// pass in params); 

这意味着你需要更新你的蒂普类来接受参数

export class Tipp { 
    id: number; 
    spieler: Spieler; 
    spiel: Spiel; 
    tippErgebnis: Spielstand; 
    aenderungsDatum: Date; 

    constructor(obj: { 
     id: number; 
     spieler: Spieler; 
     spiel: Spiel; 
     tippErgebnis: Spielstand; 
     aenderungsDatum: Date; 
    }){ 
     this.id = obj.id; 
     this.spieler = obj.spieler; 
     this.spiel = obj.spiel; 
     this.tippErgebnis = obj.tippErgebnis; 
     this.aenderungsDatu = obj.aenderungsDatum; 
    } 

    public isPersistent(): boolean { 
     return true; 
    }; 
} 

现在,当你TippEngabeComponent调用该方法isPersistent它将在TIPP存在,因为TIPP是蒂普类的一个实例。

+0

我怎样才能做到这一点? 出口类高谈阔论{ 。ID: 的TIPPS由一个服务从一个数据库作为高谈阔论类的嵌入属性递送号码; : tipps:Tipp []; } – user1350889

+0

@当你在你的父组件构建了'spiel.tipps'阵列user1350889,你应该创建一个类为每个TIPP的新实例。所以像'spiel.tipps = [新蒂普(...),新蒂普(...),新蒂普(...)];' – LLai

0
ngOnChanges(changes) { 
    console.log("Tipp changed: " + JSON.stringify(this.tipp)); 
    console.log("this.tipp instanceof Tipp: " + (this.tipp instanceof Tipp)); 
    console.log("Tipp wurde geändert: " + this.tipp.isPersistent()); 
} 

再加些调试信息reults到:

Tipp changed: {"id":1, ..... } 
this.tipp instanceof Tipp: false 
ERROR TypeError: this.tipp.isPersistent is not a function 

由于日志输出称,TIPP是不是蒂普类的一个实例。但为什么不呢? 数据作为退出后端服务的复杂json树的一部分提供。我认为树的嵌入式叶子/节点的实例化是通过角度来处理的?

export class Spiel { 
    id: number; 
    : 
    tipps: Tipp[]; 
} 

这是错误的假设,即嵌入式“的窍门”由数据服务交付JSON被实例化作为“蒂普”类型为“桌游”类的定义声明?

{ 
    "id": 1, 
    "tipps": [ 
    { 
     "id": 1, 
     "spieler": { 
     "id": 2, 
     "spielerName": "Stumbe", 
     "email": "[email protected]", 
     "rolle": "Spieler" 
     }, 
     "tippErgebnis": { 
     "toreTeam1": 1, 
     "toreTeam2": 2 
     }, 
     "aenderungsDatum": "2017-12-27T10:08:15" 
    }, 
    { 
     "id": 2, 
     "spieler": { 
     "id": 3, 
     "spielerName": "Aug", 
     "email": "[email protected]", 
     "rolle": "Admin" 
     }, 
     "tippErgebnis": { 
     "toreTeam1": 1, 
     "toreTeam2": 1 
     }, 
     "aenderungsDatum": "2017-12-27T10:08:15" 
    } 
    ] 
} 
+0

JSON从数据服务返回是简单地JSON。角度http客户端负责检索您的数据。您有责任根据需要转换该数据。在你的情况下,实例化你的自定义类。做'tipps:Tipp []'只意味着'tipps'是'Tipp'的数组类型。它不做任何实例化。 – LLai

+0

这似乎不是一个答案? – Alex

相关问题