Блог

Я очень новичок в Ionic / Angular, и мне очень сложно изменить метку с 0 1 2 на что-то другое, например, друг группы профиля. Я смог добраться до этого момента с помощью Google и YouTube, но я потратил несколько дней, пытаясь разобраться в изменении метки, и я не могу найти способ ее изменить. Я был бы очень признателен, если кто-нибудь сможет мне помочь. Заранее благодарю вас!

код в HTML-файле

 <ion-header [translucent]="false">
  <ion-toolbar color="primary">
    <ion-buttons slot="secondary">
    </ion-buttons>
    <ion-buttons slot="primary">
      <ion-button>
        <ion-icon slot="icon-only" name="search"> </ion-icon>
        <ion-icon slot="icon-only" ios="ellipsis-horizontal" md="ellipsis-vertical"></ion-icon>
      </ion-button>
    </ion-buttons>
    <ion-title>Pics</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
  <button *ngFor="let imageButton of imageButtons; let i = index" (click)="onClick(imageButton)"
    class="button">{{i}}</button>
  <img src="{{myimage || '/assets/test1.png'}}" (click)="addEvent();" />
  <h1>78%</h1>
</ion-content>
 

Код в ts-файле

 export class IndividualstockPage implements OnInit {
imageSrc = '';
  messageText = '';
  imageButtons = [ {src:'/assets/Profile.png' } , 
  {src:'/assets/Group.png'}, 
  {src:'/assets/Friend.png'}]

  constructor() { }

  ngOnInit() {
  }
  onClick(imageNameObject) {
    this.imageSrc = imageNameObject.src;
    this.messageText = imageNameObject.name;}

};

 

Как вы видите на экране, он показывает 0 1 2, и я пытаюсь найти способ предоставить описание, а не снимок экрана с порядковым номером приложения / экрана

В Html

 <ion-header [translucent]="false">
  <ion-toolbar color="primary">
    <ion-buttons slot="secondary">
    </ion-buttons>
    <ion-buttons slot="primary">
      <ion-button>
        <ion-icon slot="icon-only" name="search"> </ion-icon>
        <ion-icon slot="icon-only" ios="ellipsis-horizontal" md="ellipsis-vertical"></ion-icon>
      </ion-button>
    </ion-buttons>
    <ion-title>Pics</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
  <button *ngFor="let imageButton of imageButtons; let i = index" (click)="onClick(imageButton)"
    class="button">{{i}}</button>
  <img src="{{imageSrc || '/assets/test1.png'}}" (click)="addEvent();" />
  <h1>78%</h1>
</ion-content>
 

В ts

 imageButtons = [{src:'/assets/Profile.png',name:'Profile' } , 
  {src:'/assets/Group.png',name:'Group'}, 
  {src:'/assets/Friend.png',name:'Friend'}]

onClick(imageNameObject) {
    this.imageSrc = imageNameObject.src;
    this.messageText = imageNameObject.name;
}