angular服务使用

服务用于处理复杂的逻辑关系，而且因为是单例对象，可以用于兄弟组件之间传递数据。

依赖注入

1.定义服务

import { Injectable } from '@angular/core';  

@Injectable() //如果这个服务在构造器内注入了其他服务，必须加上这个注解，否则编译时会无法确定其他服务的类型报错。
export class Service {
    
}

2.定义好服务后，将服务注入到模块的providers数组内，如下：

import { Service } from './service';


@NgModule({
    imports: [
        ...
    ],
    declarations: [        //生命模块内组件
        ...
    ],
    providers: [ Service ],  // 注入服务
    bootstrap: [...]      //主界面，只有根模块可用
})
export class AppModule {
} 
    

3.在组件的构造方法内，定义就完成注入，类似于java的spring框架那样定义注入的变量。（该模块下的组件都可以自动注入这个服务，比如这个是根模块，那么整个项目的组件都可以使用了，而且是单例的）

还有一种简便方法，如下：

import { Injectable } from '@angular/core';  

@Injectable(
　　providers：'root'　　//这样就无需在根模块内的providers种注入了，可以换成其他模块
) 
export class Service {
    
}

自动注入不仅可以在模块内使用，还可以注入到组件，如下：

import { Component } from '@angular/core'; 
import { Service } from './service';

@Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css'],
    providers: [ Service ],  // 注入服务
})
export class AppComponent {
    constructor(public service: Service) {
        // 相当于 this.service = new Service(); 
        
    }
}

 

转载于:https://www.cnblogs.com/hzozj/p/11573006.html