angular2: cómo copiar un objeto en otro objeto
Por favor, ayúdame con el fin de copiar el objeto en otro objeto usando angular 2 ?
En angular usé angular.copy () para copiar el objeto a la referencia suelta del objeto antiguo. Pero, cuando utilicé lo mismo en angular 2 conseguir debajo de error:
Error: angular no está definido.
5 answers
Solución
Angular2 desarrollado sobre la base de tecnologías modernas como TypeScript y ES6. Así que solo puedes hacer let copy = Object.assign({}, myObject)
.
Object assign - buenos ejemplos.
Para objetos anidados :
let copy = JSON.parse(JSON.stringify(myObject))
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-06-21 11:34:50
let copy = Object.assign({}, myObject). as mentioned above
Pero esto no funcionará para objetos anidados. ASÍ que una alternativa sería
let copy =JSON.parse(JSON.stringify(myObject))
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-26 10:49:25
Puede hacer esto en Angular con ECMAScript6 utilizando el operador spread:
let copy = {...myObject};
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-08-22 15:13:20
let course = {
name: 'Angular',
};
let newCourse= Object.assign({}, course);
newCourse.name= 'React';
console.log(course.name); // writes Angular
console.log(newCourse.name); // writes React
Para Objetos anidados podemos usar bibliotecas de terceros, para copiar objetos en profundidad. En el caso de lodash, utilice _.cloneDeep ()
let newCourse= _.cloneDeep(course);
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-11-30 07:19:15
Como se sugirió anteriormente, la forma limpia de copiar objetos profundos que tienen objetos anidados dentro es usando el método cloneDeep de lodash.
Para Angular, puedes hacerlo así:
Instala lodash con yarn add lodash
o npm install lodash
.
En tu componente, importa cloneDeep
y úsalo:
import * as cloneDeep from 'lodash/cloneDeep';
...
clonedObject = cloneDeep(originalObject);
Solo son 18kb añadidos a tu compilación, bien vale la pena por los beneficios.
También he escrito un artículo aquí, si necesita más información sobre por qué usar cloneDeep de lodash.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-01-15 15:42:13