angular4-注入服务

//配置已创建的服务:import { MemberService } from "./member.service";@NgModule({
  // ...
  providers: [MemberService]
})
export class AppModule { }

//导入已创建的服务
import { MemberService } from ‘../member.service‘;

//使用构造注入方式,注入服务
export class MembersComponent implements OnInit {
   // ...
   constructor(private memberService: MemberService) { }
}

创建 MemberService 服务

import { Injectable } from ‘@angular/core‘;
import { Http } from ‘@angular/http‘;

@Injectable()
export class MemberService {
    constructor(private http: Http) { }

    getMembers() {
        return this.http
            .get(`https://api.github.com/orgs/angular/members?page=1&per_page=5`)
            .map(res => res.json())
    }
}

使用 MemberService 服务

import { MemberService } from "./member.service";

@Component({...})
export class MembersComponent implements OnInit {
    members: Member[];

    constructor(private memberService: MemberService) { }

    ngOnInit() {
        this.memberService.getMembers()
            .subscribe(data => {
                if (data) this.members = data;
            });
    }
}
时间: 2024-11-07 14:14:37

angular4-注入服务的相关文章

在angular2服务中注入服务

http://kittencup.com/javascript/2015/11/11/%E5%9C%A8angular2%E6%9C%8D%E5%8A%A1%E4%B8%AD%E6%B3%A8%E5%85%A5%E6%9C%8D%E5%8A%A1.html 如果你关注我们的文章 Angular2中的依赖注入,你知道DI系统在Angular中是如果运作的,它利用在我们代码上通过注解添加metadata来获取所有关于依赖的信息来解决我们的依赖关系 Angular 2 应用基本上可以用任何语言编写.只

介绍Angular的注入服务

其实angular的注入服务是挺复杂的,目前看源码也只看懂了一半,为了不误导大家,我也不讲敢讲太复杂,怕自己都理解错了. 首先我们要知道angular的三种注入方式: 第一种:inference var myModule = function($scope){ } 第二种:annotation var myModule = function($location){ console.log('Module:代码注入$location成功'); console.log($location); } m

Guice 学习(六)使用Provider注入服务( Provider Inject Service)

1.定义接口 package com.guice.providerInject; import com.google.inject.ProvidedBy; public interface Service { public void execute(); } 2.定义实现类 package com.guice.providerInject; public class OneService implements Service { @Override public void execute() {

避免在ASP.NET Core 3.0中为启动类注入服务

本篇是如何升级到ASP.NET Core 3.0系列文章的第二篇. Part 1 - 将.NET Standard 2.0类库转换为.NET Core 3.0类库 Part 2 - IHostingEnvironment VS IHostEnvironent - .NET Core 3.0中的废弃类型 Part 3 - 避免在ASP.NET Core 3.0中为启动类注入服务(本篇) Part 4 - 将终端中间件转换为ASP.NET Core 3.0中的端点路由 Part 5 - 将集成测试的

[原创]Aop之使用Autofac+Castle 自动注入服务且动态代理服务实现拦截

public static class AutofacComponentManualRegister { /// <summary> /// 注册 /// </summary> /// <param name="builder">bundles</param> public static IContainer RegisterIOC() { ContainerBuilder builder = new ContainerBuilder()

五)Spring + Quartz 复杂业务的两个问题:获取Spring上下文 和 自动注入服务类

配置如下: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:task="http://www.springframework.org/

SSH项目中遇到拦截器无法注入服务的问题

配置applicationContext.xml,给自定义拦截器增加了properity属性是一个biz,运行的时候一直报空指针异常,输出结果biz总是null,很是好奇,难不成拦截器无法被注入么? - -后来试了一下biz直接实例化,结果还是...空指针...实在想不明白...没法子..最后把数据提前取出来,存在session当中,在拦截器中先从session中取出来数据,然后....在做判断拦截了~~ 有人知道如何在拦截器中注入biz或者dao么?

Angular4.x 中的服务

Angular4.x 中的服务 写下前面 学习angular4.x中的服务需要借助 ToDoList 项目来做,项目代码在上篇博客中讲到. https://www.cnblogs.com/wjw1014/p/10346885.html#_label7 什么是 Angular4.x 服务 把多个组件共同的功能编写为一个服务,当组件需要使用公共的功能时,只需要把服务引用,就可以使用服务中的属性和方法. Angular CLI 创建服务 https://github.com/angular/angul

angular(3)服务 --注入---自定义模块--单页面应用

ng内部,一旦发生值改变操作,如$scope.m=x,就会自动轮询$digest队列,触发指定的$watch,调用其回调函数,然后修改dom树. 干货:https://github.com/xufei/blog/issues/10 1.ng提供了许多内置的服务,例如常用的$scope\$http\$window\$location等. http:POST请求: var app = angular.module('myApp', ['ng']); app.run(function($http){

angular4 父组件和子组件通过服务来通讯

父组件和它的子组件共享同一个服务,可以将这服务理解为全局,同时共用,但是这个服务实例的作用域被限制在父组件和其子组件内,这个组件之外的服务无法访问这个服务. import { Injectable } from '@angular/core'; @Injectable() export class myService { list:string[] = []; constructor() { } append(str:any){ this.list.push(str); } } //faher.