web-dev-qa-db-fra.com

Angular 2 - Fusion d'objets (en extension)

Comment fusionner 2 objets avec Angular 2?

Dans AngularJS 1, nous avons les fonctions "fusion" et "extension": https://docs.angularjs.org/api/ng/function/angular.mergehttps://docs.angularjs.org/api/ng/function/angular.extend

Mais apparemment rien dans Angular 2!

Avez-vous une idée?

Merci!

javascriptangularjsangular
31
tadaa9

Angular2 ne fournit rien de tel.

Vous pouvez utiliser par exemple Object.assign ()

Object.assign(target, source_1, ..., source_n)
30
Günter Zöchbauer

La manière de le faire dans Angular est d'utiliser le javascript Object.assign () :

const obj = Object.assign({}, object1, object2);

Sachez cependant que IE et Android ne sont pas encore pris en charge.
Vous avez trois options pour prendre en charge plusieurs navigateurs:

1. Angular CLI

Si vous utilisez les dernières versions de Angular avec Angular CLI, ouvrez /src/polyfills.ts Et décommentez la ligne suivante:

// import 'core-js/es6/object';

Cela activera Object polyfill, qui fournit une prise en charge inter-navigateurs pour Object.assign().

2. TypeScript

Si vous avez installé TypeScript version 2.1 ou supérieure, vous pouvez utiliser Object Spread :

const obj = {...object1, ...object2};

3. Javascript

Si vous n'utilisez pas Angular CLI et que vous souhaitez toujours utiliser Object.assign (), vous pouvez importer un polyfill dans votre projet. Il y en a plein et en voici quelques uns:

Le package core-js npm que la CLI [Angular] _ utilise pour ses polyfills:

npm install core-js --save

A simple polyfill de la conversion de TypeScript en javascript:

Object.assign = Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
        s = arguments[i];
        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
            t[p] = s[p];
    }
    return t;
};

Et enfin, le MDN polyfill .

26
m.spyratos

Vous pouvez utiliser la bibliothèque de soulignement/lodash. https://lodash.com/docs#merge

Il suffit de l’inclure dans votre pile angular2/4.
Cette question explique comment: Importation de lodash dans une application angular2 + TypeScript

0
James Earlywine