首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

.then不存在于angular 2中的类型void中

在Angular 2中,.then()方法不存在于类型void中。

在Angular 2中,使用的是RxJS库来处理异步操作。RxJS是一个强大的响应式编程库,它提供了一系列的操作符和方法来处理异步数据流。在Angular 2中,我们通常使用Observables来处理异步操作。

Observables是一种数据流,它可以发出多个值,也可以在任意时间点上发出错误或完成信号。在Angular中,我们可以使用Observables来处理异步操作,而不是使用传统的Promise。

在Angular 2中,我们可以使用Observable的subscribe()方法来订阅一个数据流,并在数据流发出新值时执行相应的操作。例如,我们可以使用subscribe()方法来处理一个HTTP请求的响应:

代码语言:txt
复制
import { HttpClient } from '@angular/common/http';

constructor(private http: HttpClient) {}

getData() {
  this.http.get('https://example.com/api/data')
    .subscribe(
      (response) => {
        // 处理响应数据
      },
      (error) => {
        // 处理错误
      }
    );
}

在上面的例子中,我们使用HttpClient模块发送了一个HTTP GET请求,并使用subscribe()方法订阅了响应的数据流。在subscribe()方法中,我们可以传入两个回调函数,第一个回调函数用于处理响应数据,第二个回调函数用于处理错误。

需要注意的是,Observables是惰性的,只有在调用subscribe()方法时才会开始执行。此外,我们还可以使用其他操作符和方法来处理Observables,例如map()、filter()、merge()等。

总结起来,.then()方法不存在于类型void中,而在Angular 2中,我们使用Observables来处理异步操作,通过subscribe()方法来订阅数据流并处理响应数据或错误。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

给Java程序员Angular快速指南 | 洞见

TypeScript 类型只存在于编译期 TypeScript 一个首要设计约束就是要兼容 ES5/6,因此不能随意增加基础设施,而像 Java 这种级别的类型支持在原生 JavaScript 是根本不存...接口则不同,我们前面说过,TypeScript 类型信息只存在于编译期,而接口作为“纯粹类型信息,也同样只存在于编译期。也就是说,在运行期间你无法判断某个对象类是否实现了某个接口。...因为运行期间接口不存在,所以在 Angular 不能把接口用作依赖注入 Token,也就不能像 Java 那样要求注入一个接口,并期待框架帮你找出实现了这个接口可注入对象,但类存在,因此,上述场景下要尽量用抽象类来代替接口...void 如果你在 Java 中经常使用 void,那就遵循同样原则用在 TypeScript 。...void 来防止别人误用。

2.4K42

Angular 结构指令模式 - 它们是什么且怎么使用

Angular ,有两种类型指令。属性指令修改 DOM 元素外观或者行为。结构指令添加或者移除 DOM 元素。 结构指令是 Angular 中最强大特性之一,然而它们却频繁被误解。...在 Angular ,有三种标准结构化指令。...Angular 我们什么时候需要用结构指令呢? 如果你想在 DOM 添加或者移除一个元素时候,你就应该使用结构指令。 当然,我们还可以使用它们来更改元素 CSS 样式,或者添加事件监听器。...甚至可以使用它们来创建一个之前不存元素。 最好规则是:当我们正在考虑操作 DOM 时候,那么是时候使用结构指令了。...总结 结构指令是 Angular 很重要一部分,我们可以通过多种方式使用它们。 希望通过本文,读者能更好理解怎么去使用这些指令和什么时候去使用这些模式。 本文为译文,采用意译形式。

3.8K20
  • 前端面试题angular_Vue前端面试题

    不止是 ng-click 表达式,只要是在页面,都不能直接调用原生 JS 方法,因为这些并不存在于与页面对应 Controller $scope 。...5、angular 控制器之间如何通信?...,以及控制器数据,就是对值“注册” scope 本质是一个总事件逻辑封装容器,同时抽象为数据载体,实质上数据都存在于浏览器堆内存 scope.apply() & <button ng-click...目录结构划分 对于小型项目,可以按照文件类型组织,比如: css js controllers models services filters templates 但是对于规模较大项目...可以用来 优化 Angular 应用性能 办法: 减少监控项(比如对不会变化数据采用单向绑定) 主动设置索引(指定 track by,简单类型默认用自身当索引,对象默认使用 $$hashKey

    14.1K20

    深究AngularJS(3)——$res

    "> $resource服务核心价值在于:提供给开发者与RESTful风格WebServices交互更好用户体验,它封装了较为低级$http,这样就不需要前端开发者写大量异步请求代码了。...版本已经不存在了,端口号会被识别而不需要手工转义~~ paramDefaults(可选) 对象类型,用于设置参数默认值,它设置数值可以被actions(第三个参数)进行覆盖。...对于设置没有出现在url模板(第一个参数)参数,将会以search query方式添加,例如: 如果url模板为/codingcool/:author,paramDefaults为{author...http服务~ 当异步请求成功,数据从服务器端取回后,被封装到一个$resource服务一个对象实例,这个对象可以被save,remove,delete方法直接操作,这种封装并提供简单CRUD操作方式...该对象包含两个get类型方法以及三个非get类型方法。

    1.1K10

    (译)通过 Git 和 Angular 了解语义化提交信息

    可以清楚地看到上面各种各样提交约定,这无疑构成了一个标准化官方规范正当理由。约定式提交就是这样一种规范,它在实践简化了 Angular 约定,并简化指出了提交消息规范要点。...话虽如此,我们一些人可能不接受这些消息约定,认为它们是可读或提供信息,这显然是有意义。所以如果我们也不需要这些附带好处,那在项目中执行这样规范显然是没有意义。...简而言之,上述消息含义是:“本次更改通过移除不推荐使用(deprecated)和不存 wtf * api 修复了来自Core软件包错误”。...正如您可能会推断,此提交实际上是 Angular 存储库存在。 常见类型 除了定义提交消息格式外,Angular 提交消息约定还指定了一个有用类型列表,其中包含了各种各样更改。...它们之间主要区别在于 approach,但是让我们关注语义化发布(Semantic Release)。

    1.4K20

    TW洞见〡为什么你Angular代码很难测试?

    ,而我们需要在业务代码调用这些代码。...如果我们每次都是赤裸裸地以全局变量形式来使用这些服务,那么造成问题就是这样代码很难测试,因为这些代码是不存在于我们代码库,而且内容应该也是不定时更新,大多数情况很多人会因为这些原因放弃到对这类操作测试...(因为在单元测试环境这个服务根本不存在),但是如果我们将这个服务包装成一个angularservice,那么就可以在测试轻易地将它替换成一个mock对象,然后验证这个mock对象上方法被调用了就可以了...我们应该设法让测试更简单,通过将Ajax请求封装到service,我们只需要让被mockservice返回我们期望结果就可以了。...原因就在于这是一个异步请求,所以需要在发请求时候就将对处理函数绑定上去。

    1.5K30

    angular知识点梳理第三篇-组件

    :在父组件ts文件引入viewchild模块 【parent.component.ts】 方案二:通过@Output触发父组件方法 第一步:在子组件ts文件引入angular核心模块output...组件之间可以进行复用,可以进行数据传递,不同组件共同构成了一个比较完整结构化项目,和vue区别在于,因为angular组件是分文件进行,简单点说就是他分为: 一个 HTML 模板,用于声明页面要渲染内容...-- 这里和vue区别在于,vue调用函数是需要@click,angular需要是(click) 只是语法上区别,执行过程是一致 --> ...()"> 执行子组件childfunc方法 第二步:在子组件声明一些需要传递变量 【children.component.ts】 //这里我们需要引入angular核心模块Input...方案二:通过@Output触发父组件方法 这个方式就是同归广播方式进行触发函数,将子组件数据主动传递到父组件中去 第一步:在子组件ts文件引入angular核心模块output和EventEmitter

    2.2K10

    Angular开发实践(七): 跨平台操作DOM及渲染器Renderer2

    在《Angular开发实践(六):服务端渲染》这篇文章最后,我们也提到了在服务端渲染需要牢记几件事件,其中就包括不要使用window、 document、 navigator等浏览器特有的类型以及直接操作...通过合适方法,使用 Angular 构建应用,可复用在多种不同平台应用上 —— Web、移动 Web、移动应用、原生应用和桌面原生应用。...此外还定义了以下引用类型:ElementRef、TemplateRef、ViewRef 、ComponentRef 和 ViewContainerRef 等。..., 'background-color', 'red'); // 通过Renderer2设置divcss样式background-color } } 获取组件div 在Angular应用不应该通过原生...操作组件div 在上面通过几种方式获取到 div DOM 对象,那么我们要如果对它进行操作呢(设置样式、属性、插入子元素等)?通过原始API 或者 jQuery 肯定是不允许了。

    2.6K90

    Angular学习(01)-架构概览

    声明 本系列文章内容梳理自以下来源: Angular 官方中文版教程 官方教程,其实已经很详细且易懂,这里再次梳理目的在于复习和巩固相关知识点,刚开始接触学习 Angular 还是建议以官网为主。...Angular架构概览.png 画了这个图来大概表示下 Angular 架构概览,基本涉及到一些常见重要知识点了,比如: 模块 路由 组件 模板 服务 指令 管道 不同类型,文件名通常会都按照一定规范来命名...如果网页很简单,只有一个首页,并不存在页面跳转场景,那么可以不用配置路由,只需要在 index.html 配置根视图,以及在根模块 bootstrap 配置根视图组件即可。...但在 Angular ,不用这么麻烦,直接在组件构造函数参数,声明某个服务类型参数即可。 指令 指令也是为组件服务,但是,是在组件模板文件来使用。...而指令分为结构型指令和属性型指令,它们区别,其实就在于,一个是改变 DOM 结构,一个是改变 DOM 元素样式。

    3.6K50

    Blazor 路由和路由模板

    过去 ASP.NET Web 窗体和现代 Web 明显区别在于 Web 服务器入口是否存在路由组件。在 Web 窗体,绝大多数 Web 终结点都是物理文件资源,直接通过其页面路径调用。...路由器之战:Blazor 与Angular 很长一段时间,路由逻辑实现都隐藏在 Web 服务器或服务器端框架(如 ASP.NET)折叠。...路由器实现是通过 SPA 框架(其中 Angular 最为出色)移动到客户端。让我们花点时间对合并 Angular 路由器和仍在使用 Blazor 路由器功能进行简要比较。...当前地址与链接匹配时,规范 HTML 定位点元素和 NavLink 组件之间区别在于“活动”样式自动分配。...若要通过 Blazor 页面代码进行导航,应首先为 IUriHelper 抽象类型注入已配置依赖项。

    8.4K21

    Angular 项目多国语言设置

    React 和 Vue 项目同理~ 这里我们仅考虑简体中文和美国英文两种语言,使用框架版本为 @angular/core: "~12.1.0" 在日常开发,我们难免会引入第三方 UI 框架,那么这就涉及了第三方...NG-ZORRO Empty 组件提示成功更改为英文: 设置自定义多国语言 那么,对于我们自定义页面内容,怎么翻译呢?...这里路径也方便我们在部署过程 url 调整,比如添加个前缀 /jimmy/ 。详见 Angular 项目路径添加指定访问前缀。...,如果不存在则获取浏览器设定的当前语言;当 assets/i18n/ 文件夹下面没有我们要找语言包时候,则使用默认 en-US.json 语言包,当存在时候,则使用选中语言包。...得到结果如下: 中文设定 英文设定 当然,如果想在页面属性调用多语言,同理。

    2K20

    理解Angular*ngIf指令中加问号和不加问号区别

    Angular开发,我们经常使用ngIf指令来根据条件动态渲染或移除元素。然而,在一些情况下,我们可能需要处理一些可能为空对象属性。这时,就需要了解在ngIf指令中使用加问号和不加问号区别。...如果pickModel对象存在且depotSaleAreaName字段存在,则执行后面的逻辑;如果pickModel对象或depotSaleAreaName字段不存在,则不会报错,而是直接跳过渲染。...depotSaleAreaName"值为false,从而跳过对应元素渲染。这种方式非常实用,可以减少因空指针异常导致代码错误,增强程序稳定性。...综上所述,加上问号条件操作符能够在访问对象属性时避免空指针异常,当对象属性不存在时不会报错。这样处理方式对于处理动态数据或异步数据非常有用,能够提高代码稳定性和可靠性。...总结一下,加问号和不加问号在Angular中使用*ngIf指令区别主要在于处理对象属性是否为空时表现。我们可以根据具体业务需求来选择合适方式,确保代码可靠性和稳定性。

    31000

    AngularDart4.0 指南- 依赖注入 顶

    '; } Car类在其构造函数创建它需要所有东西。 有什么问题? 问题在于Car类是脆弱,不灵活,难以测试。 这辆车需要引擎和轮胎。...您可以通过指定具有依赖类型构造函数参数来告诉Angular在组件构造函数中注入依赖项。 这里是HeroListComponent构造函数,要求注入HeroService。...注入器维护一个内部令牌提供者映射,当它被要求依赖时候它会引用它。 令牌是mapkey。 在之前所有例子,依赖性值都是一个类实例,类类型作为自己查找键。...当您使用HeroService类类型定义构造函数参数时,Angular知道注入与该HeroService类令牌关联服务: HeroListComponent(HeroService heroService...在这个例子Angular将组件注入器注入到组件构造函数。 该组件然后在ngOnInit()向注入注入器询问它想要服务。 请注意,服务本身不会被注入到组件

    5.7K20

    Angular4记账webApp练手项目之五(Angular4项目中创建service(服务)和使用http模块)

    有关@Injectable和@Component,都是angular关键字或者关键注解。通过注解来表明js文件类型,以方便angular框架进行调用。...服务注入,是angular中用来剥离controller和业务逻辑方式。...(): void { console.log(this.urls.DeleteBill); } } 使用http模块 在我们app.module.ts已经引入了 import { HttpModule...} from '@angular/http'; 我们要在account.service.ts引入 import { Http } from '@angular/http'; import 'rxjs...这里写图片描述 对,会提示,如果使用了类型里没有的字段,还会报错。这活生生把一个弱类型语言变成了强类型。当然如果不喜欢,我们可以不用自定义类。把自定义Result换成any即可。 ?

    1.3K10

    Angular快速学习笔记(3) -- 组件与模板

    显示数据 在 Angular 中最典型数据显示方式,就是把 HTML 模板控件绑定到 Angular 组件属性。...在 Angular ,组件扮演着控制器或视图模型角色,模板则扮演视图角色。 ### 模板 HTML HTML 是 Angular 模板语言。几乎所有的 HTML 语法都是有效模板语法。...如果你要引用变量名存在于一个以上命名空间中,那么,模板变量是最优先,其次是指令上下文变量,最后是组件成员。...TypeScript 就会确保不存在意料之外 null 或 undefined。...在这种模式下,有类型变量默认是不允许 null 或 undefined 值,如果有未赋值变量,或者试图把 null 或 undefined 赋值给不允许为空变量,类型检查器就会抛出一个错误 Angular

    15.3K30

    用VSCode开发一个基于asp.net core 2.0sql server linux(docker)ng5bs4项目(2)

    从结果CHARACTER_MAXIMUM_LENGTH字段可以看出, 目前name字段类型都是nvarchar(max): ?...在文件写下apiuri: http://localhost:5000/api/tvnetworks 然后你会发现, 该uri上方有一个send request 按钮: ?...根据文档, 使用下面命令创建一个名为tv-network-list.tscomponent, 并且在app模块进行注册, 如果不存在components文件夹则创建这个文件夹. ng g c components...创建TvNetwork表单: 根据文档, 使用下面命令创建一个名为tv-network-form.tscomponent, 并且在app模块进行注册, 如果不存在components文件夹则创建这个文件夹...然后编辑tv-network.service.ts, 添加一个获得所有tv network方法, 返回类型是Observable: import { Injectable } from '@angular

    2.4K50

    Angular ElementRef 简介

    此外还定义了以下引用类型:ElementRef、TemplateRef、ViewRef 、ComponentRef 和 ViewContainerRef 等。...通过 ElementRef 我们就可以封装不同平台下视图层 native 元素 (在浏览器环境,native 元素通常是指 DOM 元素),最后借助于 Angular 提供强大依赖注入特性,我们就可以轻松地访问到...我们先来介绍一下整体需求,我们想在页面成功渲染后,获取页面 div 元素,并改变该 div 元素背景颜色。...首先我们要先获取 div 元素,在文中 “ElementRef 作用” 部分,我们已经提到可以利用 Angular 提供强大依赖注入特性,获取封装后 native 元素。...我们看到设置 div 元素背景,我们是默认应用运行环境在是浏览器。前面已经介绍了,我们要尽量减少应用层与渲染层之间强耦合关系,从而让我们应用能够灵活地运行在不同环境。

    1.6K60

    TypeScript 简介及编码规范

    Void 某种程度上来说,void 类型像是与 any 类型相反,它表示没有任何类型。...当一个函数没有返回值时,你通常会见到其返回值类型void: // 声明函数返回值为void function warnUser(): void { console.log("This is...,声明一个 void 类型变量没有什么作用,因为它值只能为 undefined 或 null: let unusable: void = undefined; Null and Undefined...然而,当你指定了--strictNullChecks 标记,null 和 undefined 只能赋值给 void 和它们各自。 Never never 类型表示是那些永不存类型。...TypeScript 接口是一个非常灵活概念,除了可用于对类一部分行为进行抽象以外,也常用于对「对象形状(Shape)」进行描述。

    10.4K40

    angular知识点梳理第二篇-基本语法

    angular基本语法,这样有利于后面我们进行梳理别的知识点做一些铺垫 基本语法 常见指令 NgModel NgModel就和vuev-model效果是一致,只是写法会有一些区别,vue是可以直接进行使用...,但是在angular我们引入框架一个核心模块FormsModule才可以,该指令就是将数据驱动视图改变!...在app.modules.ts引入forms模块 // 核心模块 import { NgModule } from '@angular/core'; //引入forms模块实现数据双向绑定 import.../home.component.less'] }) export class HomeComponent implements OnInit { //声明一个list类型变量,用于验证NgFor.../home.component.less'] }) export class HomeComponent implements OnInit { //声明一个boolean类型变量,用于验证ngif

    2.5K30
    领券