как объединить 2 массива в угловых 7 машинопись - PullRequest
Новая
       22

как объединить 2 массива в угловых 7 машинопись

0 голосов
/ 12 мая 2019

В 7 угловых проектах для конкретного компонента мне нужно получать данные с сайта wp и сайта dotnet через api.Из wp api я получаю данные как (данные журнала консоли): 

(2) [{…}, {…}]
0: {title: "Henk WJ Ovink", description: "Special Envoy for International Water Affairs, Kin…ands, and Sherpa to the High Level Panel on Water", slug: "http://siwidev.websearchpro.net/press/", image: "http://siwidev.websearchpro.net/wp-content/uploads/2019/03/636385501414087698.png", imageWidth: 1903, …}
1: {title: "Amina J. Mohammed", description: "Deputy Secretary-General United Nations", slug: "http://siwidev.websearchpro.net/community/", image: "http://siwidev.websearchpro.net/wp-content/uploads/2019/03/h20fddcc.jpg", imageWidth: 776, …}
length: 2
__proto__: Array(0)

Из dotnet api я получаю данные как (данные журнала консоли): 

(5) [{…}, {…}, {…}, {…}, {…}]
0: {id: 8342, title: "Panaceas or painkillers – what role for sustainability assessment tools?", description: null, slug: "8342-panaceas-or-painkillers---what-role-for-sustainability-assessment-tools", image: "https://siwi.websearchpro.net/Content/ProposalReso…g-2019-8342-tn-img-2019-8605-iStock-500553193.jpg", …}
1: {id: 8380, title: "Inclusive Policy and Governance for Water and Sanitation ", description: null, slug: "8380-inclusive-policy-and-governance-for-water-and-sanitation", image: "https://siwi.websearchpro.net/Content/ProposalReso…019-8420-img-2019-8420-org-InkedPhoto IWRM_LI.jpg", …}
2: {id: 8464, title: "Cities4Forests: 50 cities commit to forests citing water benefits", description: null, slug: "8464-cities4forests-50-cities-commit-to-forests-citing-water-benefits", image: "https://siwi.websearchpro.net/Content/ProposalReso…464-tn-img-2019-8481-WESCA illegal FS dumping.jpg", …}
3: {id: 8474, title: "Urban water resiliency: a coordinated response from source to settlement ", description: null, slug: "8474-urban-water-resiliency-a-coordinated-response-from-source-to-settlement", image: "https://siwi.websearchpro.net/Content/ProposalResources/Image/Default/default-www-tn.jpg", …}
4: {id: 8526, title: "Including all: participatory approaches in water governance and programmes ", description: null, slug: "8526-including-all-participatory-approaches-in-water-governance-and-programmes", image: "https://siwi.websearchpro.net/Content/ProposalReso…ge/2019/Thumbnail/img-2019-8526-tn-Field trip.JPG", …}
length: 5
__proto__: Array(0)

Теперь мне нужнообъединить эти 2 массива, перемешать элемент массива и показать его.Что я сделал до сих пор: 

public merge_array : Array<{ }> = [];
/* wp api */
this.accountService.getKeynote( wp_params ).then( ( response: any ) => {
    this.merge_array ? this.merge_array : [];
    this.wp_data_array = response.data;
    for ( let value of this.wp_data_array ) {
        this.merge_array.push( value );
    };
});
/* dot net api */
this.accountService.getConferences( params ).then( ( dotnetresponse: any ) => {
    if ( dotnetresponse.status == 'Ok' ) {
        this.merge_array ? this.merge_array : [];
        this.dotnet_data_array = dotnetresponse.conferences;
        for ( let value of this.dotnet_data_array ) {
            this.merge_array.push( value );
        };
    }
});

Но когда я консоль журнала 'merge_array' здесь, результат будет: 

[]
0: {title: "Henk WJ Ovink", description: "Special Envoy for International Water Affairs, Kin…ands, and Sherpa to the High Level Panel on Water", slug: "http://siwidev.websearchpro.net/press/", image: "http://siwidev.websearchpro.net/wp-content/uploads/2019/03/636385501414087698.png", imageWidth: 1903, …}
1: {title: "Amina J. Mohammed", description: "Deputy Secretary-General United Nations", slug: "http://siwidev.websearchpro.net/community/", image: "http://siwidev.websearchpro.net/wp-content/uploads/2019/03/h20fddcc.jpg", imageWidth: 776, …}
2: {id: 8342, title: "Panaceas or painkillers – what role for sustainability assessment tools?", description: null, slug: "8342-panaceas-or-painkillers---what-role-for-sustainability-assessment-tools", image: "https://siwi.websearchpro.net/Content/ProposalReso…g-2019-8342-tn-img-2019-8605-iStock-500553193.jpg", …}
3: {id: 8380, title: "Inclusive Policy and Governance for Water and Sanitation ", description: null, slug: "8380-inclusive-policy-and-governance-for-water-and-sanitation", image: "https://siwi.websearchpro.net/Content/ProposalReso…019-8420-img-2019-8420-org-InkedPhoto IWRM_LI.jpg", …}
4: {id: 8464, title: "Cities4Forests: 50 cities commit to forests citing water benefits", description: null, slug: "8464-cities4forests-50-cities-commit-to-forests-citing-water-benefits", image: "https://siwi.websearchpro.net/Content/ProposalReso…464-tn-img-2019-8481-WESCA illegal FS dumping.jpg", …}
5: {id: 8474, title: "Urban water resiliency: a coordinated response from source to settlement ", description: null, slug: "8474-urban-water-resiliency-a-coordinated-response-from-source-to-settlement", image: "https://siwi.websearchpro.net/Content/ProposalResources/Image/Default/default-www-tn.jpg", …}
6: {id: 8526, title: "Including all: participatory approaches in water governance and programmes ", description: null, slug: "8526-including-all-participatory-approaches-in-water-governance-and-programmes", image: "https://siwi.websearchpro.net/Content/ProposalReso…ge/2019/Thumbnail/img-2019-8526-tn-Field trip.JPG", …}
length: 7
__proto__: Array(0)

Длина массива слияния приходит как 0. Яне в состоянии решить это.Что я делаю не так в отношении инициализации массива или толчка массива.Любая помощь / предложения приветствуются.

Ответы [ 2 ]

0 голосов
/ 12 мая 2019

Не удивительно, что массив будет пустым, потому что возврат Promises работает асинхронно. Следовательно, оба массива будут пустыми в тот момент, когда вы записываете значения.

Вам нужно использовать Promise.all . Согласно документации,

Метод Promise.all () возвращает одно Обещание, которое разрешается, когда все обещания, переданные как итеративные, разрешены или когда итерация не содержит обещаний. Он отклоняет причину первого обещания, которое отклоняет.

Что теперь можно сделать, это использовать Promise.all для разрешения обещаний из обоих запросов (вы можете использовать console.log(response), чтобы убедиться, что обещания действительно разрешены и возвращено значение), после чего следует использовать распространить синтаксис , чтобы объединить оба массива. Затем мы случайным образом перестановим массив, используя алгоритм, предоставленный Лоренсом Холстом для здесь . Это должно дать вам полученный перемешанный массив. 

const getKeynote = this.accountService.getKeynote(wp_params);
const getConferences = this.accountService.getConferences(params);

Promise.all([getKeynote, getConferences]).then(response => {
  //console.log(response);
  const merged = [...response[0], ...response[1]];
  const shuffleArray = (array) => {
    for (let i = array.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [array[i], array[j]] = [array[j], array[i]];
    }
  };
  shuffleArray(merged);
  console.log(merged);
});
0 голосов
/ 12 мая 2019

Простой Object.assign(target, source) должен сделать трюк

Документация на https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Чтобы перетасовать массив, используйте destruuring : 

for (let i = target.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [target[i], target[j]] = [target[j], target[i]];
}
...