Question

在构建我的（基本）应用程序时，我看到了一些编译错误。如果我npm start该应用程序启动正常，并且没有显示错误。但是，如果我执行ng build --prod命令，则会发出3条错误消息，如下所示：

ERROR in ng:///clarity-seed/src/app/app.component.html (103,54): Property 'gradient' does not exist on type 'AppComponent'.

ERROR in /clarity-seed/src/$$_gendir/app/app.component.ngfactory.ts (845,36): Property 'pageviews' does not exist on type '{}'.

ERROR in ng:///clarity-seed/src/app/app.component.html (120,95): Property 'hostname' does not exist on type '{}'.

pageviews和hostname变量都包含在我正在下面复制/粘贴的app.component.ts中。我怀疑这是如何在文件中声明/使用这些变量的问题。

import { Component, OnInit, Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { Headers, Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';

@Injectable()

@Component({
    selector: 'yelb',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss']
})

export class AppComponent implements OnInit {
    constructor(private router: Router,
                private http:  Http
               ) {}

  votes: any[] = [];
  stats = {};
  ngOnInit(){this.getvotes(); this.getstats()}

  public appserver = `http://localhost:4567`;

  view: any[] = [700, 200];

  hostname = "mio host"

  pageviews = 3

  colorScheme = {
    domain: ['#5AA454', '#A10A28', '#C7B42C', '#AAAAAA']
  };

    getvotes(): void {
    const url = `${this.appserver}/getvotes`;
    this.http.get(url)
                .map((res: Response) => res.json())
                .subscribe(res => {console.log(res); this.votes = res})                
    }

    getstats(): void {
    const url = `${this.appserver}/getstats`;
    this.http.get(url)
                .map((res: Response) => res.json())
                .subscribe(res => {console.log(res, res.hostname, res.pageviews); this.stats = res})                
    }

    vote(restaurant: string): void {
    const url = `${this.appserver}/${restaurant}`;
    this.http.get(url)
                .map((res: Response) => res.json())
                .subscribe(res => {console.log(res)});    
    this.getvotes()
    }
}

但是我在html文件（gradient）中使用app.component.html并利用外部库。

这是使用app.component.html的{{1}}部分的摘录。

我再次怀疑gradient是唯一没有被正确宣布的地方：

gradient

任何提示我如何摆脱这些错误消息？当然这段代码可以通过实质性的优化，但是现在我只需要编译没有错误。

谢谢！

更新＃1：我已通过添加<div class="col-xs"> <ngx-charts-advanced-pie-chart [view]="view" [scheme]="colorScheme" [results]="votes" [gradient]="gradient"> </ngx-charts-advanced-pie-chart> </div>修复了gradient变量的问题。我刚刚想到编译时错误中描述的错误的gradient: boolean;引用来自html文件（而不是来自ts文件）。这些是我在hostname文件中引用hostname和pageviews的方式/时间的代码摘要：

app.component.html

和

<li class="list-group-item">
       <a target="_blank">Container: <b><u>{{stats.hostname}}</u></b></a>
</li>

编译Angular2应用程序时出错

0 个答案: