Угловая объединенная переменная 2 в интерполяции

Question

У меня есть два связанных объекта:

itemsObj = {
    'item1' : 'A1',
    'item2' : 'A2',
    'item3'  : 'B',
    'item4'  : 'C',
    'item5'  : 'D'
};

И:

itemsObj2 = {
    'A1' : 'Very conservative and up',
    'A2' : 'Conservative and up',
    'B'  : 'Balanced and up',
    'C'  : 'Growth and up',
    'D'  : 'Aggressive'
};

Интерполяция {{itemsObj.item1}} вернет A1 и {{itemsObj2.A1}} вернет Very conservative and up.

Как объединить itemsObj.item1 с itemsObj2.A1 для возврата Very conservative and up?

Моя попытка:

{{itemsObj2.itemsObj.item1}} но, конечно, это неправильно,Так я могу знать, как объединить в моем случае?

Answer 1

Так как вам нужно сопоставить ключ, вы можете выполнить

   <h1> {{itemsObj2[itemsObj.item1]}}</h1>

STACKBLITZ DEMO

Answer 2

TS

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  public items: string[];

  constructor() {
    const itemsObj = {
      'item1': 'A1',
      'item2': 'A2',
      'item3': 'B',
      'item4': 'C',
      'item5': 'D'
    };

    const itemsObj2 = {
      'A1': 'Very conservative and up',
      'A2': 'Conservative and up',
      'B': 'Balanced and up',
      'C': 'Growth and up',
      'D': 'Aggressive'
    };

    this.items = Object
      .values(itemsObj)
      .map(itemKey => itemsObj2[itemKey]);
  }
}

HTML

<div *ngFor="let item of items">
  {{ item }}
</div>

Вывод:

Very conservative and up
Conservative and up
Balanced and up
Growth and up
Aggressive

Демонстрация Stackblitz:

https://stackblitz.com/edit/angular-pbdfux?file=src%2Fapp%2Fapp.component.html

Answer 3

Сделайте это:

itemsObj2[itemsObj.item1]    //setting itemsObj.item1's value as itemsObj2's key

DEMO:

itemsObj = {
    'item1' : 'A1',
    'item2' : 'A2',
    'item3'  : 'B',
    'item4'  : 'C',
    'item5'  : 'D'
};

itemsObj2 = {
    'A1' : 'Very conservative and up',
    'A2' : 'Conservative and up',
    'B'  : 'Balanced and up',
    'C'  : 'Growth and up',
    'D'  : 'Aggressive'
};

console.log(itemsObj2[itemsObj.item1])