“错误:未捕获(承诺):没有Jsonp提供程序”(HTML / Javascript / Typescript / Angular2)

露娜

错误的屏幕截图:

在此处输入图片说明

.ts文件代码(SearchDisplay.component.ts):

import {Component, OnInit} from 'angular2/core';
import {Router} from 'angular2/router';
import {Hero} from './hero';
import {HeroService} from './hero.service';
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
import {HeroesComponent} from './heroes.component';
import {HeroDetailComponent} from './hero-detail.component';
import {DashboardComponent} from './dashboard.component';
import {SpreadSheetComponent} from './spreadsheeteditall.component';
import {SwitchUsersComponent} from './SwitchUsers.component';
import {BiddingPageComponent} from './BiddingPage.component';
import { Injectable } from 'angular2/core';
import { Jsonp, URLSearchParams } from 'angular2/http';



@Component({
  selector: 'SearchAndDisplayComponent',
  templateUrl: 'app/SearchDisplay.component.html',
  styleUrls: ['app/SearchDisplay.component.css'],
  providers: [HeroService],
  directives: [ROUTER_DIRECTIVES]
})

@Injectable()

export class SearchAndDisplayComponent{
   constructor(private jsonp: Jsonp) {}
  search (term: string) {
    let ebayURL = 'http://developer.ebay.com/Devzone/XML/docs/reference/ebay/index.html';
    var params = new URLSearchParams();
params.set('search', term); // the user's search value
    params.set('action', 'opensearch');
    params.set('format', 'json');
    params.set('callback', 'JSONP_CALLBACK');
    // TODO: Add error handling
    return this.jsonp
               .get( ebayURL, { search: params })
               .map(request => <string[]> request.json()[1]);
  }


}

我认为可能是导致该错误(.SearchDisplay.component.html)的.html文件代码的一部分:

<input class="search2" id="txtSearch" type="text" name="serach_bar" size="31" maxlength="255"       
value="" style="left: 396px; top: 153px; width: 293px; height: 26px;" />
<input class="search1" type="submit" name="submition" value="Search" style=" padding-  
bottom:20px; left: 691px; top: 153px; height: 23px" />
<button (click)="search(term)">Search</button>
<script type="text/javascript">
    document.getElementById('frmSearch').onsubmit = function() {
        window.location = 'local data here (not sure how to code this)' + document.getElementById('txtSearch').value;
        return false;
    }
</script>

问题背景:我正在尝试为基本上是eBay克隆的网站创建搜索栏。

原始代码来自Wikipedia示例搜索栏,但我想将其更改为从ebay提取数据(或仅创建一个本地搜索栏,仅包含单词“ apple”和“ car”)。

在这个问题中发布了指向punker /全压缩项目文件的链接:

搜索栏隐藏未键入的结果

马杜·兰扬(Madhu ranjan)

JSONP_PROVIDERS在引导程序或更高级别的组件中,您可能缺少必须在更高级别注入的提供程序。

阅读有关JSONP_PROVIDERS的更多信息

引导应用程序时,应将JSONP_PROVIDERS包含在组件的注入器中或根注入器中。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Angular2和TypeScript导入错误

来自分类Dev

Angular2 Typescript全局提供程序使用接口解析

来自分类Dev

Angular2 TypeScript - 错误 TS2307:找不到模块“angular2/forms”

来自分类Dev

Angular2 / TypeScript-变量未更改

来自分类Dev

将Http注入服务时Angular2 [typescript]错误

来自分类Dev

Angular2 TypeScript指令错误TS2345

来自分类Dev

Angular2 @ TypeScript可观察到的错误

来自分类Dev

Angular2 beta14 Typescript routerLink绑定错误

来自分类Dev

Angular2/typescript 中的 Jquery 轮播方法错误

来自分类Dev

Typescript中带有angular2的对象类型的数组

来自分类Dev

带有TypeScript的Angular2:将组件导入组件

来自分类Dev

带有Angular2和Typescript的Visual Studio 2013

来自分类Dev

带有Angular2的TypeScript中的Observable规范

来自分类Dev

学习Angular2 TypeScript2:共享类没有指令错误

来自分类Dev

Angular2 + Typescript + jspm:没有Http的提供者(App-> Provider-> Http)

来自分类Dev

对于Angular2项目,在gulp中,如何合并所有从typescript生成的JavaScript文件并将其添加到index.html文件中

来自分类Dev

Angular2没有提供服务错误的提供程序

来自分类Dev

angular2 TypeScript性能

来自分类Dev

TypeScript类型定义;导出默认值以在Angular2中使用外部JavaScript库

来自分类常见问题

错误:在angular2中没有HttpHandler的提供程序

来自分类Dev

带有Typescript的Angular2-加载angular2 / platform / browser时出错

来自分类Dev

ES5上的Angular2 Http提供程序(不是TypeScript)

来自分类Dev

Angular2上的Jsonp提供程序错误

来自分类Dev

使用jspm配置运行Typescript angular2应用程序的页面加载错误

来自分类Dev

如何在没有模拟的情况下测试Angular2 / TypeScript HTTPService

来自分类Dev

在Angular2 Typescript中将数组连接到没有.interval()的Observable

来自分类Dev

Typescript / Angular2 http.post没有设置标题

来自分类Dev

当没有字符串使用Angular2 / Typescript显示时,停止隐藏元素

来自分类Dev

带有TypeScript的Angular2:@component之后声明预期的编译器错误

Related 相关文章

  1. 1

    Angular2和TypeScript导入错误

  2. 2

    Angular2 Typescript全局提供程序使用接口解析

  3. 3

    Angular2 TypeScript - 错误 TS2307:找不到模块“angular2/forms”

  4. 4

    Angular2 / TypeScript-变量未更改

  5. 5

    将Http注入服务时Angular2 [typescript]错误

  6. 6

    Angular2 TypeScript指令错误TS2345

  7. 7

    Angular2 @ TypeScript可观察到的错误

  8. 8

    Angular2 beta14 Typescript routerLink绑定错误

  9. 9

    Angular2/typescript 中的 Jquery 轮播方法错误

  10. 10

    Typescript中带有angular2的对象类型的数组

  11. 11

    带有TypeScript的Angular2:将组件导入组件

  12. 12

    带有Angular2和Typescript的Visual Studio 2013

  13. 13

    带有Angular2的TypeScript中的Observable规范

  14. 14

    学习Angular2 TypeScript2:共享类没有指令错误

  15. 15

    Angular2 + Typescript + jspm:没有Http的提供者(App-> Provider-> Http)

  16. 16

    对于Angular2项目,在gulp中,如何合并所有从typescript生成的JavaScript文件并将其添加到index.html文件中

  17. 17

    Angular2没有提供服务错误的提供程序

  18. 18

    angular2 TypeScript性能

  19. 19

    TypeScript类型定义;导出默认值以在Angular2中使用外部JavaScript库

  20. 20

    错误:在angular2中没有HttpHandler的提供程序

  21. 21

    带有Typescript的Angular2-加载angular2 / platform / browser时出错

  22. 22

    ES5上的Angular2 Http提供程序(不是TypeScript)

  23. 23

    Angular2上的Jsonp提供程序错误

  24. 24

    使用jspm配置运行Typescript angular2应用程序的页面加载错误

  25. 25

    如何在没有模拟的情况下测试Angular2 / TypeScript HTTPService

  26. 26

    在Angular2 Typescript中将数组连接到没有.interval()的Observable

  27. 27

    Typescript / Angular2 http.post没有设置标题

  28. 28

    当没有字符串使用Angular2 / Typescript显示时,停止隐藏元素

  29. 29

    带有TypeScript的Angular2:@component之后声明预期的编译器错误

热门标签

归档