大佬教程收集整理的这篇文章主要介绍了Angular 5服务变量值更新,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我有两个不相关的组件,我想使用服务将更新的对象从一个发送到另一个.但是我无法在服务中更新对象.
第一部分:
import { Soruservice } from '../soru.service'; import { SoruModel,Secenekmodel } from '../soruModel'; @Component({ SELEctor: 'app-first',templateUrl: './first.component.html',styleUrls: ['./first.component.scss'],providers: [Soruservice] }) export class FirstComponent implements OnInit { public soruLst : [SoruModel]; constructor( private soruservis : Soruservice ) { } ngOnInit(){ this.soruservis.getirSoruLst().subscribe( veri => { this.soruLst = veri as [SoruModel]; }) } //// MAKE SOME CHANGES ON "soruLst" locally // Send updated 'soruLst' to service updateSoruLst(){ this.soruservis.updateSoruLst(this.soruLst); } }
我的服务:
import { Injectable } from '@angular/core'; import { SoruModel,Secenekmodel } from './soruModel'; import { http } from '@angular/http'; const MetaJson = 'assets/data/Meta.json'; @Injectable() export class Soruservice { public sorular = [] as [SoruModel]; constructor( private http:http ) { this.sorular = [] as [SoruModel]; } getirSoruLst() { return this.http.get(MetaJson) .map(yanit => yanit.json()) } updateSoruLst( soruLst : [SoruModel] ) { this.sorular = soruLst; } getSorular() : [SoruModel] { return this.sorular; } }
第二部分:
@H_690_5@mport { Soruservice } from '../soru.service'; import { SoruModel,Secenekmodel } from '../soruModel'; @Component({ SELEctor: 'app-second',templateUrl: './second.component.html',styleUrls: ['./second.component.scss'],providers: [Soruservice] }) export class SecondComponent implements OnInit { public soruLst : [SoruModel]; constructor( private soruservis : Soruservice ) { } ngOnInit(){ this.soruLst = this.soruservis.getSorular(); console.log(this.soruLst); } }这就是我想要做的:
>在FirstComponent中,从服务中获取’soruLst’并在本地更改(成功)
>在FirstComponent中,将更改后的’soruLst’发送到服务(success – updateSoruLst)
>在服务中,更新’sorular’,在’updateSoruLst’中(失败 – 它没有改变,只是在功能范围内改变但我仍然无法读取更新的值).我有问题:
“this.sorular”值不会全局变化.
>在SecondComponent中,从服务中读取更新的’sorular'(失败,仍然无法读取更新的值)
我想我必须改变我的服务,但找不到我必须改变的地方..
如何在服务中更新我的对象?
>在您的模块类中
>或者在上述组件的父组件类中(如果有)
这样,组件将共享相同的服务实例,您将能够实现所需的功能.
假设您的组件位于app的根模块中.从组件装饰器移除提供程序属性并更改模块,如下所示.
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { FirstComponent } from './first.component'; import { SecondComponent} from './second.component'; import { Soruservice } from '../soru.service'; @NgModule({ imports: [ BrowserModule ],declarations: [ AppComponent,FirstComponent,SecondComponent ],providers: [ Soruservice ],bootstrap: [AppComponent] }) export class AppModule { }
以上是大佬教程为你收集整理的Angular 5服务变量值更新全部内容,希望文章能够帮你解决Angular 5服务变量值更新所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。