ドロップダウンから選択したオプションを保持する

Question

私はさまざまなオプションでドロップダウンを持っています。私は、ユーザーがそれを変更するまでドロップダウンの上部に選択したオプションを保持したい。今のところ、...

HTML

<select class="form-control-mb-12" 
       (change)="intSelection($event.target.value)" > 

        <option value="1/4">1/4</option> 
        <option value="1/8">1/8</option> 
        <option value="1/16">1/16</option> 
        <option value="1/32">1/32</option> 
</select> 

コンポーネント

最初の値を持つドロップダウンリセットを私は任意のオプションを選択して、私は部品の外に移動して戻ってきた場合

import { Component, OnInit } from '@angular/core'; 
import {NgbModal, ModalDismissReasons} from '@ng-bootstrap/ng-bootstrap'; 
import { ModuladorService } from 'app/Services/modulador.service' 

@Component({ 
    selector: 'app-resumen', 
    templateUrl: './resumen.component.html', 
    styleUrls: ['./resumen.component.scss'], 
    providers: [ModuladorService] 
}) 
export class ResumenComponent implements OnInit { 

    intSelected : string = "" ; 

    constructor(private _moduladorService:ModuladorService) { 

     this.intSelected = this._moduladorService.obtenerParametros(); 

    } 




    ngOnInit() { 

    } 

    intSelection(value){ 

    switch(value) { 
    case "1/4": 
    this.intSelected = value; 
     break; 
    case "1/8": 
    this.intSelected = value;   
     break; 
    case "1/16": 
    this.intSelected = value; 
     break; 
    case "1/32": 
    this.intSelected = value; 
     break; 
    } 
     this._moduladorService.actualizarParametros(this.intSelected); 
    } 

SERVICE

import { Injectable } from '@angular/core'; 
import { InitParam } from 'app/layout/modulador/resumen/init-param' 

@Injectable() 
export class ModuladorService extends InitParam { 

    constructor() { 
    super(); 
    this.load(); 
    } 

    obtenerParametros(){ 

     var intSelected = JSON.parse(localStorage.getItem('intSelected')); 
     return intSelected; 

    } 

    actualizarParametros(newParam : any){ 

      var intSelected = JSON.parse(localStorage.getItem('intSelected')); 

      intSelected = newParam; 

      localStorage.setItem('intSelected', JSON.stringify(intSelected)); 


    } 

} 

INIT間違いなくシングルトン、のように感じている、とあなたは行われていない場合は、@Injectableサービス、で選択したものを保つことができるサービス

export class InitParam { 



load(){ 

     if(localStorage.getItem('intSelected')=== null){ 
      console.log('No se encontraron parametros...'); 

      var intSelected = '1/4' 

      localStorage.setItem('intSelected', JSON.stringify(intSelected)); 
     }else{ 
       console.log('Cargando parametros...'); 
     } 



    } 
} 

Answer 1

ください。

または、親コンポーネントから入出力します。

Answer 2

サービスにストレージデータが必要です。モジュールに注入可能なサービス。 app.module.ts