Angular:存储要在多个html页面上使用的数据

时间:2018-04-02 22:06:50

标签: javascript angular

我在名为.ts的{​​{1}}文件中有一系列名称。

"domain-names.ts"

我还有一个import { Domain } from './library'; export const DOMAIN: Domain[] = [ {id: 1, catergory: "testing" }, {id: 2, catergory: "utilities" }, {id: 3, catergory: "mocking" }, {id: 4, catergory: "cryptograpghy" }, {id: 5, catergory: "json" }, {id: 6, catergory: "database" }, {id: 7, catergory: "security" }, {id: 8, catergory: "object-relational mapping" }, {id: 9, catergory: "xml" } ];文件,可以在多个类中提取和保存。

"this domain.service.ts"

我正在尝试创建一个比较两个域名的复选框表单。我想保存用户选择的域名,以便我可以使用这些信息来创建图表。我想知道如何根据用户选择的复选框样式表单组件在多个HTML页面中保存域名。

我尝试创建一个名为compare的组件来从服务中检索域名并进行比较,但我不知道如何去做。

import { Injectable } from '@angular/core';
import { Domain } from './library';
import { DOMAIN } from './domain-names';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';

@Injectable()
export class DomainService {

  constructor() { }

  getDomain(id: number): Observable<Domain>{
    return of(DOMAIN.find(domain => domain.id === id));
  }
}

这就是我想象HTML代码寻找表单的方式:

import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'app-compare',
  templateUrl: './compare.component.html',
  styleUrls: ['./compare.component.css']
})
export class CompareComponent implements OnInit {

  domain: Domain;
  // private domainService: DomainService, private location: Location, private route: ActivatedRoute
  constructor() {}


  ngOnInit() {
    this.getDomain();
  }

  getDomain(): void {
    const id = +this.route.snapshot.paramMap.get('id');
    this.domainService.getDomain(id)
      .subscribe(domain => this.domain = domain);
  }

}

0 个答案:

没有答案