JQuery 함수를 사용하지 않고 각도 4로 깊은 복사하는 방법은 무엇입니까?

나는 영웅 배열을 * ngFor에 의해 목록에 표시했다. 그 중 하나를 클릭하면 새로운 변수에 복사되고 새로운 변수는 견인 바인딩으로 입력된다. 내 heroClass는 :JQuery 함수를 사용하지 않고 각도 4로 깊은 복사하는 방법은 무엇입니까?

는

export class Hero { 
    id: number; 
    name: string; 
    }

나의 영웅 - 모의 목록 :

는

import { Hero } from './heroClass'; 

export const HEROES: Hero[] = [ 
    { id: 11, name: 'Mr. Nice' }, 
    { id: 12, name: 'Narco' }, 
    { id: 13, name: 'Bombasto' }, 
    { id: 14, name: 'Celeritas' }, 
    { id: 15, name: 'Magneta' }, 
    { id: 16, name: 'RubberMan' }, 
    { id: 17, name: 'Dynama' }, 
    { id: 18, name: 'Dr IQ' }, 
    { id: 19, name: 'Magma' }, 
    { id: 20, name: 'Tornado' } 
];

내 영웅 구성 요소 :

import { Component, OnInit } from '@angular/core'; 
    import { Hero } from '../hero'; 
    import { HEROES } from '../mock-heroes'; 

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

     heroes = HEROES; 

     selectedHero: Hero; 


     constructor() { } 

     ngOnInit() { 
     } 

     onSelect(hero: Hero): void { 
     this.selectedHero = hero; 
     } 
    }

는 heroes.component.html

<h2>My Heroes</h2> 
<ul class="heroes"> 
    <li *ngFor="let hero of heroes" 
    [class.selected]="hero === selectedHero" 
    (click)="onSelect(hero)"> 
    <span class="badge">{{hero.id}}</span> {{hero.name}} 
    </li> 
</ul> 

<div *ngIf="selectedHero"> 

    <h2>{{ selectedHero.name | uppercase }} Details</h2> 
    <div><span>id: </span>{{selectedHero.id}}</div> 
    <div> 
    <label>name: 
     <input [(ngModel)]="selectedHero.name" placeholder="name"> 
    </label> 
    </div> 

</div>

문제입니다 내가 하나를 선택할 때 영웅과 텍스트 입력에 그것의 사본을 보여주고 변경하는 목록의 영웅도 변경합니다. AngularJS와 1

내가 angular.copy() 메소드에 내장되어 있지만, 각 2 년 전 영웅의 새로운 생성 할 필요를 사용하여이 문제를 방지 주요 영웅 selectedHero의 때에 프로퍼티를 돌리는 :

selectedHero: new Hero(); 
onSelect(hero: Hero): void { 
     this.selectedHero.name = hero.name; 
     this.selectedHero.id= hero.id; 
     }

jquery 또는 js 함수와 위의 방법을 사용하지 않고 각도 2에서 깊은 복사 다른 방법이 있습니까?

출처

2017-12-17 Aref Zamani

js 함수를 사용하지 않으려합니다. –

다른 JS 응용 프로그램과 같은 방식입니다. 일반적인 도우미 기능을 제공하는 것은 프레임 워크의 책임이 아닙니다. 사실, AngularJS는 jQuery API를 에뮬레이트하려고 시도하고 '복사'와 '확장'을 고려해서는 안되며 무언가 잘못되었다는 것을 의미합니다. – estus

JavaScript 프레임 워크를 사용하고 있으며 JavaScript 함수를 사용하지 않으시겠습니까? 뭐? –

내 생각에 이것은 꽤 해킹되지만 작동합니다.

this.selectedHero = JSON.parse(JSON.stringify(hero));

출처

2017-12-17 07:23:53 Zze

lodash's cloneDeep 기능을 사용하십시오. 이 같은 기능을 제공하는 각도의 문제가 아니기 때문에 깊은 개체를 복제에 대한 각도에서 거기에 아무것도

출처

2017-12-17 08:19:17

JQuery 함수를 사용하지 않고 각도 4로 깊은 복사하는 방법은 무엇입니까?

답변

관련 문제