Я новичок в машинописи и веб-программировании в целом. Я делаю простое приложение на ионном языке, которое в качестве одной из функций будет иметь возможность показывать список зарегистрированных пользователей с фотографиями их профилей. Их фотографии профиля хранятся в хранилище Firebase.
Я успешно получаю URL-адреса к изображениям профиля, но когда я пытаюсь связать их с моим в моем html-файле, кажется, что он не работает.
URL-адрес, который я получаю, действителен, когда я пытаюсь скопировать его в тег, он работает, но я хочу, чтобы он был динамическим.
файл registeredusers.html:
<ion-item *ngFor="let profile of profiles">
<ion-avatar item-left> <ion-img [src]="profile.url"> </ion-img> </ion-avatar>
<h2>{{profile.name}}</h2>
<span>{{profile.country}}</span>
<button ion-button (click)="followProfile(profile.name);" outline item-right>Follow</button>
</ion-item>
файл registeredusers.ts:
export class RegisteredusersPage {
private profileListRef = this.db.list<Profile>('profile-list');
constructor(
public navCtrl: NavController,
public navParams: NavParams,
private storage: Storage,
private db: AngularFireDatabase,
private toastCtrl: ToastController,
public angularFireAuth: AngularFireAuth
) {}
profiles = [];
firestore = firebase.storage();
ionViewDidLoad() {
console.log('ionViewDidLoad RegisteredusersPage');
this.getProfile();
}
getProfile() {
console.log(this.db.list('profile-list'));
var database = firebase.database();
var ref = database.ref("profile-list");
ref.on('value', this.gotData.bind(this), this.errData.bind(this));
}
async gotData(data) {
console.log(data.val());
var profilesArr = data.val();
var keys = Object.keys(profilesArr);
var that = this;
var array = [];
console.log("profilesArr: " + profilesArr);
for (var i = 0; i < keys.length; i++) {
var k = keys[i];
var profileName = profilesArr[k].name;
var profileCountry = profilesArr[k].country;
var profileEmail = profilesArr[k].email;
let imageName = k + "__" + "profile";
if (profileName && profileCountry && profileEmail && profilesArr[k].email != this.angularFireAuth.auth.currentUser.email) {
const profileImageUrl = await this.firestore.ref().child(profileEmail + "/images/" + imageName).getDownloadURL();
array[i] = profilesArr[k];
profilesArr[k].url = profileImageUrl;
if (profilesArr[k].email != this.angularFireAuth.auth.currentUser.email) {
this.profiles[i] = profilesArr[k];
console.log("profiles[i].url:" + this.profiles[i].url);
}
}
}
console.log(this.profiles);
}
{{profile.name}} и {{profile.country}} внутри в порядке, а this.profiles [i] .url возвращает правильный URL, но я не могу ссылаться на него из HTML файл.
Любая помощь будет принята с благодарностью! Спасибо заранее!
РЕДАКТИРОВАТЬ: не уверен, если это имеет значение, но так выглядит моя страница this