Сохранить массив из базы данных Firebase - PullRequest
Новая
       26

Сохранить массив из базы данных Firebase

0 голосов
/ 18 февраля 2020

Я пытаюсь построить проект, используя Angular и angularfire. Мой проект о рисовании полигонов с использованием листовки, а затем о перемещении координат полигона в базу данных. Я успешно передал массив в базу данных, но у меня проблема с получением координат из базы данных.

Структура базы данных: 

{
  "Locations" : {
    "-M0M9kqEbE0FVMzIZAg0" : {
      "text" : [ [ {
        "lat" : 35.97800618085566,
        "lng" : 42.03369140625001
      }, {
        "lat" : 33.88865750124075,
        "lng" : 41.46240234375001
      } ] ]
    }
  }
}

Я пытаюсь сохранить массив выше в классе ts, а не в html.

Мой код: 

    export class WeatherNowComponent {

      itemsRef: AngularFireList<any>;
      items: Observable<any[]>;

      coords :any
      constructor(private db: AngularFireDatabase) {

        this.itemsRef = this.db.list('Locations')
        // Use snapshotChanges().map() to store the key
        this.items = this.itemsRef.snapshotChanges().pipe(
          map(changes => 
            changes.map(c => ({ key: c.payload.key, ...c.payload.val() }))
          )
        );


        this.db.list('Locations').snapshotChanges().subscribe((markers: any) => {

          console.log(markers)
          markers.forEach(singlemarker => {
            console.log(singlemarker)

   // ADD COORDS to MAP POLYGON
    var polygon = L.polygon([singlemarker.text.lat,singlemarker.text.lng], {color: 'red'}).addTo(this.map);
          });
        });

        console.log(this.items)
      }



    }

Таким образом, у меня есть только ключевой массив в журнале консоли без остальных объектов массива.

enter image description here

1 Ответ

0 голосов
/ 18 февраля 2020

Если вы намеренно вызываете оператор распространения, потому что это массив, попробуйте присвоить его значению свойства в определении литерала объекта. 

{ key: c.payload.key, values: ...c.payload.val() }

Редактировать: основываясь на вашем комментарии, я бы все равно сказал, что просто присвойте массив координат (объекты пар свойств lat / lng) свойству values, чтобы выполнить итерацию позже. Я предполагаю, что метод .val () должен возвращать массив этих значений. В противном случае, пожалуйста, опубликуйте, что возвращает .val ().

Также я заметил кое-что еще, что вы должны проверить.

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

Редактировать # 2: На основании вашего второго комментария ниже. То, что вы просите, мне до сих пор неясно. Поэтому я дам еще два возможных ответа на основании комментария: «Хорошо, мой вопрос, как я могу получить массив напрямую?» 

// Possibility #1
// Simplest is to store off the returned data into the coords variable for later processing.
// You can then get the array directly at any later point just by accessing the coords

this.db.list('Locations').snapshotChanges().subscribe((markers: any) => {
    coords = markers;
});

// Possibility #2
// Since the data structure you are using works like a dictionary data structure
// Define some structures to store off the data and get at the array data directly later

// Define this somewhere outside your class
interface ICoordinate {
    lat: string;
    lng: string;
}

// Initialize coordinate dictionary
let coordinates: { [key: string] : ICoordinate[]; } = {};


// Retrieve locations and store off coordinates to get at the array data directly
this.db.list('Locations')
    .snapshotChanges()
    .subscribe((markers: any) => {
        coordinates[markers.key] = ICoordinate[];

        markers.forEach(singlemarker => {
           coordinates[markers.key].push({ lat: singlemarker.text.lat, lng: singlemarker.text.lng });
        });
    });

Правка № 3: О да, я вижу. Массив необходимо инициализировать перед добавлением в него.

Обновленный код. Кроме того, в качестве дополнительной помощи по будущим вопросам очень полезно, если у вас есть фрагмент кода. ТАК вопрос, на который можно сослаться: Мне сказали создать «работоспособный» пример с «Фрагментами стека», как мне это сделать?

Надеюсь, это поможет.

Удачного кодирования!

...