Как получить доступ к имени переменной объекта в HTML

Question

У меня есть переменная области действия

$scope.variableName = "content";
$scope.content['key'] = 'value';

В HTML я могу получить доступ к значению содержимого в выражении ng-if как к содержимому ['key']

Но я хочу получить к нему доступ, используя variableNameстрока, т.е. имя переменной объекта, который я использую в условии ng-if в HTML

Like {{variableName}}['key']

Возможно ли это или может быть достигнуто.

Answer 1

Вы можете получить доступ, используя {{content["key"]}}, а также {{content.key}}.

var module = angular.module("myModule", []);

module.controller("myController", function($scope) {
  $scope.variableName = "content";
  $scope.content = {};
  $scope.content['key'] = 'value';
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>

<div ng-app="myModule">
  <div ng-controller="myController">
    {{content["key"]}} <br />
  </div>
</div>

Answer 2

Вы можете взять ссылку на $scope через ключевое слово this:

angular.module('app', []).controller('ctrl', function($scope){
  $scope.variableName = "content";
  $scope.content = {};
  $scope.content['key'] = 'value';  
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js">
</script>

<div ng-app='app' ng-controller='ctrl'>
  {{this[variableName]['key']}}
</div>