сделать элемент перетаскивания (изображение), при этом я хочу сравнить элемент с текущим элементом - PullRequest
0 голосов
/ 01 апреля 2020

В настоящее время я работаю над перетаскиванием изображения. при отбрасывании изображения (массива объекта) следует проверить, равно ли отбрасываемое изображение текущему изображению (изображению тега span), которое уже доступно в выпадающем списке (оно будет меняться случайным образом). Теперь я хочу сравнить массив объекта (изображение) и тег span (изображение). пожалуйста, помогите мне в этом.

В моем коде он показывает правильный (в предупреждении) для первой капли, даже если он не равен. но показывает некорректно для остальной части изображения, даже если оно равно.

component.ts:

origin = [{    
    img: 'https://www.gstatic.com/webp/gallery3/1.png'
  },
  {    
      img: 'https://www.gstatic.com/webp/gallery3/2.png'
  },
  {   
      img: 'https://www.gstatic.com/webp/gallery3/3.png'
  }];

  /*---------dropped image will store here------*/

  destination = [
  ]; 

/*-----which is written in a seperate js file-----*/   

function matchimages(domimages, destination) {
  return destination.some((item, index) => item.img === domimages[index].src);
}

 /*--------------- */

  drop(event: CdkDragDrop<string[]>) {
    if (event.previousContainer === event.container) {
      moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
    } else {
      let item:any = event.previousContainer.data[event.previousIndex];
      let copy:any = JSON.parse(JSON.stringify(item));
      let element:any = {};
        for(let attr in copy){
          if(attr == 'title'){
            element[attr] = copy[attr] += ' copy';
          }else{
            element[attr] = copy[attr];
          }
        }

    let allimages = document.querySelectorAll(".captchaText span img");
this.destination=[element];
const hasmatchingimage = matchimages(allimages, this.destination)
console.log(this.destination);
clearimg() 
  if(hasmatchingimage){
    alert("correct");
  }else{
    alert("incorrect");
  }
} 

component. html:

image

equal notequal notequal

...