Question

在构建此应用程序时，我一直遇到此错误“ [ts]'，'预期”。如果添加逗号，保存并再次尝试，则该应用程序将运行。现在，如果我停止本地服务器并尝试再次运行它，则必须删除逗号才能使该应用程序运行。我想知道发生了什么事情以及我做错了什么，因为我才刚刚开始学习如何使用Angular。

错误消息

ERROR in src/app/breeds/breeds.component.ts(35,5): error TS1005: ',' expected. src/app/newbreed/newbreed.component.ts(41,10): error TS1128: Declaration or statement expected. src/app/newbreed/newbreed.component.ts(45,1): error TS1128: Declaration or statement expected.

代码

import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { map } from 'rxjs/operators';
import { element } from 'protractor';
import {RequestOptions, Request, RequestMethod} from '@angular/http';

@Component({
  selector: 'app-breeds',
  templateUrl: './breeds.component.html',
  styleUrls: ['./breeds.component.css']
})
export class BreedsComponent implements OnInit {
  restItems: any;
  restItemsUrl = 'https://breeds-a648.restdb.io/rest/dogs';

  constructor(private http: HttpClient) {};

  ngOnInit() {
    this.getRestItems();
  }

  // Read all REST Items
  getRestItems(){
    this.restItemsServiceGetRestItems()
      .subscribe(
        restItems => {
          this.restItems = restItems;
      },
       (err) => console.log(err), () => {
         setTimeout(() => {
           this.getImages();
           this.deleteBreed();
        },0)
      }
    } <<<<<<< This is where it expects ","

  getImages() {
    let breedName = document.querySelectorAll('#breedName');
    breedName.forEach( (el) => {
      let image = document.createElement('IMG');
      this.http.get(`https://pixabay.com/api/?key=&q=${el.innerHTML}&image_type=photo`).subscribe(
        res => {
          image.src = res.hits[0].largeImageURL;
          image.width = '100';
          image.height = '100';
          el.appendChild(document.createElement('br'));
          el.appendChild(image);      
        },
        err => {
          alert("Error occured");
        }
      );
    })
  }

  deleteBreed() {
    let deleteLinks = document.querySelectorAll('.del');
    deleteLinks.forEach( (e) => {
      e.addEventListener('click', (element) => {
        this.http.delete('https://breeds-a648.restdb.io/rest/dogs' + '/' + element.target.id, { headers: new HttpHeaders()
        .set("x-apikey", "")
        .set("Content-Type", "application/json")
        .set('cache-control', 'no-cache') })
        .subscribe(
          res => {
            window.location.href = '/index';
          },
          err => {
            alert("Error occured");
          }
        );
      })
    })
  }

  // Rest Items Service: Read all REST Items
  restItemsServiceGetRestItems() {
    const headers = new HttpHeaders()
    .set("x-apikey", "")
    .set("Content-Type", "application/json")
    .set('cache-control', 'no-cache');

    return this.http
      .get<any[]>(this.restItemsUrl,{headers})
      .pipe(map(data => data));
  }

}

Answer 1

您的方法中缺少）：

getRestItems(){
    this.restItemsServiceGetRestItems()
      .subscribe(
        restItems => {
          this.restItems = restItems;
      },
       (err) => console.log(err), () => {
         setTimeout(() => {
           this.getImages();
           this.deleteBreed();
        },0)
      }) <-- added closing )
    }

建立Angular应用程序时出错

1 个答案: