Question

我正在创建带有angular的nativescript应用，正在使用json服务器。我的json服务器正在运行，当我在运行“ tns run android”时，它已成功同步，但我的应用程序显示为空白。

我可以在手机浏览器上访问json服务器数据库

我所有的cabs.component.ts

    import { Component, OnInit, Inject } from '@angular/core';
import { Cabin } from '../shared/cabin';
import { CabinService } from '../services/cabin.service';

@Component({
  selector: 'app-cabins',
  moduleId: module.id,
  templateUrl: './cabins.component.html'
})

export class CabinsComponent  implements OnInit {
  cabins: Cabin[];

  errMess: string;

  constructor(private cabinService: CabinService,
    @Inject('BaseURL') private BaseURL) {
  }

  ngOnInit() {
    this.cabinService.getCabins()
      .subscribe(cabins => this.cabins = cabins,
        errmess => this.errMess = <any>errmess);
  }

}

我所有的cab.service.ts

import { Injectable } from '@angular/core';
import { Cabin } from '../shared/cabin';
import { Observable } from 'rxjs';
import { Http, Response } from '@angular/http';
import { HttpClient, HttpHeaders } from "@angular/common/http";
import { baseURL } from '../shared/baseurl';
import { ProcessHTTPMsgService } from './process-httpmsg.service';
import { map } from "rxjs/operators";
import { catchError } from "rxjs/operators";

@Injectable()
export class CabinService {

  cabins: any[];

  constructor(private http: HttpClient,
              private processHTTPMsgService: ProcessHTTPMsgService) { }

  getCabins(): Observable<Cabin[]> {
    return this.http.get(baseURL + 'cabins')
                    .pipe(map(res => { return this.processHTTPMsgService.extractData(res); }),
                    catchError(error => { return this.processHTTPMsgService.handleError(error); }));
  }

  getCabin(id: number): Observable<Cabin> {
    return  this.http.get(baseURL + 'cabins/'+ id)
                    .pipe(map(res => { return this.processHTTPMsgService.extractData(res); }),
                    catchError(error => { return this.processHTTPMsgService.handleError(error); }));
  }

  getFeaturedCabin(): Observable<Cabin> {
    return this.http.get(baseURL + 'cabins?featured=true')
                    .pipe(map(res => { return this.processHTTPMsgService.extractData(res)[0]; }),
                    catchError(error => { return this.processHTTPMsgService.handleError(error); }));
  }

}

我的app.module.ts

    imports: [
        NativeScriptHttpClientModule,
        NativeScriptModule,
        AppRoutingModule
    ],
providers: [
    {provide: 'BaseURL', useValue: baseURL},
    CabinService,
    ProcessHTTPMsgService
]

我正在控制台中收到此消息

×未设置ANDROID_HOME环境变量，或者它指向不存在的目录。您将无法为Android执行任何与构建相关的操作。为了能够执行与Android构建相关的操作，请将ANDROID_HOME变量设置为指向Android SDK安装目录的根。

×警告：未安装或未正确配置Android SDK中的adb。对于与Android相关的操作，NativeScript CLI将使用adb的内置版本。为避免使用本机Android模拟器（Genymotion或已连接）可能出现的问题 Android设备，请确认您已安装最新的Android SDK，并且如http://developer.android.com/sdk/index.html#Requirements

中所述

×警告：未安装或未正确配置Android SDK。您将无法在本机模拟器中运行您的应用程序。能够运行应用在本机Android模拟器中，确认您已安装最新的Android SDK 及其依赖性，如http://developer.android.com/sdk/index.html#Requirements

中所述

×找不到兼容的Android SDK进行编译。为了能够针对Android进行构建，请安装Android SDK 28或更高版本。运行$ sdkmanager来管理您的Android SDK版本。

×您需要在系统上安装Android SDK Build-tools。您可以安装以下范围内的任何版本：'> = 23 <= 28'。从命令行运行$ sdkmanager，以安装所需的Android Build Tools。如果已经安装了它们，请确保正确设置ANDROID_HOME环境变量。

×执行命令'javac'时出错。确保已安装Java开发工具包（JDK）并设置JAVA_HOME环境变量。您将无法为Android构建项目。为了能够针对Android进行构建，请验证您是否已安装Java开发工具包（JDK）并根据系统要求对其进行了配置，如下所示： http://docs.nativescript.org/setup/ns-cli-setup/ns-setup-win.html#system-requirements

中所述

×警告：未安装Java开发工具包（JDK）或未正确配置。您将无法使用Android SDK，并且可能无法使用执行一些与Android相关的操作。为了确保您可以发展和测试您的Android应用程序，验证您是否已将JDK安装为在http://docs.oracle.com/javase/8/docs/technotes/guides/install/install_overview.html中进行了描述（对于JDK 8）。

Answer 1

您应该使用HttpClient而不是“ Http”。像这样：

AppModule：

@NgModule({
...
imports: [
NativeScriptHttpModule
]
})
export class AppModule {}

然后使用您的服务

constructor(httpClient: HttpClient){}

您还应该使用空数组初始化cabins。由于它以undefined开头，因此ListView在尝试加载数据时可能会引发错误。

我的nativescript应用未连接到json服务器数据库

1 个答案: