angular2中的全局对象

时间:2017-07-12 15:48:02

标签: javascript angular object typescript ionic-framework

如何在angular2中创建全局对象。我正在使用ionic2中的 navParams 逐页(可能是4-5页)从一个页面到另一个页面收集数据。但是想把它存储在全局对象中最后提交它。我已经尝试使用全球提供商,但还没有获得大部分&也没有得到任何线索。请任何建议。

2 个答案:

答案 0 :(得分:1)

与我的问题离子社区suggest一样,使用全球提供商。我确实使用全球提供商来保存我的7步表单数据并在最后一步提交最终提交。

我用离子3。 提供者代码:

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


@Injectable()
export class NcConnectionProvider {
    public statecode:any;
    public districtcode:any;

  constructor() {
    //console.log('Hello NcConnectionProvider Provider');
  }

}

Page.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { NcConnectionProvider } from '../../providers/nc-connection/nc-connection';


@IonicPage()
@Component({
  selector: 'page-nc-connection',
  templateUrl: 'nc-connection.html',
})
export class NcConnectionPage {
    public distbform:FormGroup;
    public statedata:any;
    public districtdata:any;

  constructor(public navCtrl: NavController, 
    public navParams: NavParams,
    public ncdatashare: NcConnectionProvider) {

  }

    locateDistb(form: NgForm){
        this.ncdatashare.statecode = this.distbform.value.state;
        this.ncdatashare.districtcode = this.distbform.value.district;
      }

}

您可以根据需要将提供者注入多个页面并访问全局变量/对象。就像示例值设置为this.ncdatashare.statecode = this.distbform.value.state;一样,现在您可以访问this.ncdatashare.statecode到其他页面,但提供者必须注入其中。

答案 1 :(得分:0)

确保提供一些示例代码以更好地阐述问题。此外,您可以按照以下方式收集单个对象中的数据。

使用变量及其getter setter创建服务。在组件中注入此服务并在需要的地方设置数据,然后再使用其get方法将其重新收回。

    @Injectable()
    export class DataService{
      private _data: any;

      get data() {
         return this._data;
      }

      set data(data: any) {
        this._data = data;
      }    
   }

并在您的组件旁边

    @Component({
      // configurations
    })
    export class LoginComponent {
    constructor(public dataService: DataService) {
       this.dataService.data = { userAge: 37  }
    }
}

并且您需要提交此数据,只需使用getter将其收回即可。

let finalData = this.dataService.data;

不确定您的用例。但我希望它可以帮到你。