2016-12-09 52 views
0

我正在忙於研究一款非常基本的條碼掃描器應用程序。有兩種選擇:輸入條形碼或掃描條形碼。當我輸入條形碼時,出現以下錯誤:這個錯誤根本無法幫助我......任何想法這可能是什麼原因/我能看到什麼?Angular2/Nativescript:使用RestService時非常奇怪/無益的錯誤

我的錯誤:

JS: EXCEPTION: Uncaught (in promise): TypeError: Cannot read property 'getCookie' of null 
JS: ORIGINAL STACKTRACE: 
JS: Error: Uncaught (in promise): TypeError: Cannot read property 'getCookie' of null 
JS:  at resolvePromise (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:416:31) 
JS:  at /data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:452:17 
JS:  at ZoneDelegate.invokeTask (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:223:37) 
JS:  at Object.inner.inner.fork.onInvokeTask (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:6197:41) 
JS:  at ZoneDelegate.invokeTask (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:222:42) 
JS:  at Zone.runTask (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:123:47) 
JS:  at drainMicroTaskQueue (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:355:35) 
JS: Unhandled Promise rejection: Cannot read property 'getCookie' of null ; Zone: angular ; Task: Promise.then ; Value: TypeError: Cannot read property 'getCookie' of null TypeError: Cannot read property 'getCookie' of null 
JS:  at CookieXSRFStrategy.configureRequest (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/http/bundles/http.umd.js:1183:91) 
JS:  at XHRBackend.createConnection (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/http/bundles/http.umd.js:1223:32) 
JS:  at httpRequest (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/http/bundles/http.umd.js:1561:24) 
JS:  at Http.request (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/http/bundles/http.umd.js:1661:38) 
JS:  at Http.get (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/http/bundles/http.umd.js:1672:25) 
JS:  at RestService.getProduct (/data/data/org.nativescript.barcodescanner/files/app/services/rest.service.js:18:26) 
JS:  at AppComponent.submitBarcode (/data/data/org.nativescript.barcodescanner/files/app/app.component.js:22:26) 
JS:  at /data/data/org.nativescript.barcodescanner/files/app/app.component.js:42:19 
JS:  at ZoneDelegate.invoke (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:190:28) 
JS:  at Object.inner.inner.fork.onInvoke (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:6206:41) 
JS: Error: Uncaught (in promise): TypeError: Cannot read property 'getCookie' of null 

我app.module.ts:

import { NgModule, ValueProvider } from "@angular/core"; 
import { NativeScriptFormsModule } from "nativescript-angular/forms"; 
import { NativeScriptModule } from "nativescript-angular/platform"; 

import { HttpModule } from '@angular/http'; 

import { BarcodeScanner } from "nativescript-barcodescanner"; 
import { RestService } from './services/rest.service'; 

import { AppComponent } from "./app.component"; 






@NgModule({ 
    imports : [ 
    NativeScriptModule,  
    NativeScriptFormsModule, 
    HttpModule 
    ], 
    declarations : [ 
    AppComponent  
    ], 
    providers : [ 
    RestService, 
    BarcodeScanner], 
    bootstrap : [AppComponent]  
}) 
export class AppModule {} 

我app.component.ts:

import { Component, Input, OnInit, Inject } from "@angular/core"; 
import { BarcodeScanner } from "nativescript-barcodescanner"; 
import { ProductModel } from './models/product'; 

import { RestService } from './services/rest.service'; 



@Component({ 
    selector: "my-app", 
    templateUrl : "./app.component.html" 
}) 
export class AppComponent implements OnInit { 
    public barcode: number; 
    public textBarcode: number; 
    @Input() product: ProductModel; 


    public constructor(private restService: RestService, private barcodeScanner: BarcodeScanner) { 

    } 

    submitTextBarcode() { 
     this.restService.getProduct(this.textBarcode) 
    .subscribe(
    (res) => { 
     this.product = new ProductModel(res.BaseURI, res.CustomError, res.ProviderName, res.RequestFormData, res.RequestURI, res.ResponseCode, res.AvgQty1, res.AvgQty2, res.AvgQty3, res.BarCode, res.Description, res.POSDescription, res.POSPrice, res.ProductCode, res.PurchCount, res.StockOnHand); }, 
    (res) => { 
     console.log("failure" + res); 
    } 
    ); 
    } 


    submitBarcode(barcode: number){ 
    this.restService.getProduct(barcode) 
    .subscribe(
    (res) => { 
     this.product = new ProductModel(res.BaseURI, res.CustomError, res.ProviderName, res.RequestFormData, res.RequestURI, res.ResponseCode, res.AvgQty1, res.AvgQty2, res.AvgQty3, res.BarCode, res.Description, res.POSDescription, res.POSPrice, res.ProductCode, res.PurchCount, res.StockOnHand); 
     //console.log("returned product description: " + this.product.Description); 
     //console.log(res); 
    }, 
    (res) => { 
     console.log("failure" + res); 
    } 
    ); 
    //console.log("product: " + product); 

} 


    public scan() { 
     this.barcodeScanner.scan({ 
      formats : "EAN_13", 
      cancelLabel : "Stop scanning", 
      message : "Go scan something Use the volume buttons to turn on the flash", 
      preferFrontCamera : false, 
      showFlipCameraButton : false 
     }).then((result) => { 
      this.barcode = +result.text; 
      this.submitBarcode(this.barcode);   
     }, (errorMessage) => { 
      console.log("Error no scan" + errorMessage); 
     }); 
    } 

    public ngOnInit() {  

    } 

} 

我app.component.html:

<stackLayout> 
<label text="Scan or enter a barcode"></label> 
<textField hint="Enter barcode" keyboardType="number" [(ngModel)]="textBarcode"></textField> 
<button *ngIf="textBarcode" text="Submit" (tap)="submitTextBarcode()"></button> 
<button text="Scan" (tap)="scan()"></button> 

<label *ngIf="product" text="Description"></label> 
<label *ngIf="product" [text]="product.Description"></label> 

<label *ngIf="product" text="POS Description"></label> 
<label *ngIf="product" [text]="product.POSDescription"></label> 

<label *ngIf="product" text="POS price"></label> 
<label *ngIf="product" [text]="product.POSPrice"></label> 

<label *ngIf="product" text="Stock On Hand"></label> 
<label *ngIf="product" text="product.StockOnHand"></label> 

</stackLayout> 
+0

我的猜測是因爲你使用已實現一些DOM相關屬性和方法的Angular HTTP。從NativeScript使用HTTP而不使用import *作爲來自「http」的http; http://docs.nativescript.org/cookbook/http –

+0

@Nick Iliev所以我只是在我的app.module.ts中添加這個導入?我需要改變我的RestService implimentation嗎?在nativescript groceries-list角度教程中,我看到他們使用角度http模塊而沒有問題? – user2094257

+0

是的,添加導入..我不知道你的RestService是什麼樣子,但你可以在角度應用程序中看到NativeScript htpp的基本用法https://github.com/NativeScript/nativescript-sdk-examples-ng/tree/大師/應用程序/ http –

回答

1

Бased在sample-Groceries tutorial ..注意到這條線

import { NativeScriptHttpModule } from "nativescript-angular/http"; 

和進口妮相同文件NativeScriptHttpModule ..also在同一節如下解釋:

"... .NativeScriptHttpModule is a NativeScript wrapper of Angular’s HttpModule, a module that declares all of Angular’s HTTP-based services—including the Http service that UserService uses..."