首页 > 解决方案 > 无法找到 SyntaxError:“JSON.parse:JSON 数据的第 1 行第 1 列的意外字符”(Angular)

问题描述

我对 Angular 很陌生,在显示来自 PHP 的数据时遇到了麻烦。

我有一个 view_property.php 文件,它从属性表中调出数据,如下所示: 在此处输入图像描述

我假设数据库连接正常,因为控制台日志显示了属性表中的所有详细信息,如下所示: 在此处输入图像描述 在此处输入图像描述

问题是我找不到语法错误。因为我不确定它的发生是因为 PHP 文件中的 json_encode 还是因为 Angular。

这是我的财产.ts

export class Property 
{
    constructor
    (
        id: number,
        name:  String,
        price:  number,
        address: String,
        nearby_places: String,
        size: String,
        bedroom: number,
        bathroom: number,
        carpark: String,
        facilities: String,
        furnishing: String,
        manager_id: number,
        property_status: String
    ){} 
}

这是我的 view-property.component.html。

  <tr *ngFor="let property of allproperty; let i =index;">
          <td>{{i + 1}}</td>
          <td>{{property.id}}</td>
          <td>{{property.name}}</td>
          <td>$ {{property.price}}</td>
          <td>{{property.address}}</td>
          <td>
            <button type="button" class="btn btn-success" (click)="getNavigation('view', property.id)">View</button>
            <button type="button" class="btn btn-warning" (click)="getNavigation('update', property.id)">Edit</button>
            <button type="button" class="btn btn-danger" (click)="deleteProperty('', property.id)">Delete</button>
          </td>
        </tr>

这是我的 view-property.component.ts。

import { Component, OnInit } from '@angular/core';
import {CrudService} from '../../services/crud.service';
import {Router} from '@angular/router';
import { Property } from 'src/app/property';

@Component({
  selector: 'app-view-property',
  templateUrl: './view-property.component.html',
  styleUrls: ['./view-property.component.css']
})
export class ViewPropertyComponent implements OnInit 
{

    public allproperty: any = [];

    constructor(private crudService: CrudService, private router: Router) { }

    ngOnInit() {
      this.loadProperty();
    }

    loadProperty(){
      this.crudService.getProperty().subscribe(
          propertyData => {
            this.allproperty = propertyData;
          }
      );
    }

    deleteProperty(link, id){
      this.crudService.deleteProperty(id).subscribe(result => {
        window.location.reload();
        this.router.navigate([link]);
      });
    }

    getNavigation(link, id){
        if(id === ''){
            this.router.navigate([link]);
        } else {
            this.router.navigate([link + '/' + id]);
        }
    }

  }

请指出语法错误在哪里。非常感谢您的指导。

标签: angular

解决方案


推荐阅读