Динамическая ссылка на вложенный объект Javascript

Question

У меня есть массив объектов ($scope.fields), которые определяют, как поля ввода должны быть установлены для $scope.data объектная модель. Свойство fieldName фактически является путем в data Объект на поле. Вложенные объекты отделяются знаком точки.

например:

    $scope.data = {
        user: {
        }
    }
    $scope.fields = [
        {fieldName:'user.firstName',fieldLabel:'First Name',dsiabled:false}
        {fieldName:'user.location.lat',fieldLabel:'Latitude',dsiabled:false}
        {fieldName:'user.location.long',fieldLabel:'Latitude',dsiabled:false}
    ]

Каков наилучший способ в HTML связать поля $scope.data на основе fieldName. Я знаю о Javascript Eval - но это лучший способ сделать это? И почему этот синтаксис не работает для меня?

то есть:

 <div ng-repeat="fieldObj in fields">
    <dd ng-bind="eval('data.' fieldObj.fieldName)"></dd>
 </div>

Answer 1

Благодаря @Felix Kling я разобрался, как это сделать.

Я использовал идею Object by string из Felix_kings ref и применил функцию обратного вызова к ng-bind, который получил полную ссылку на объект.

Answer 2

Недавно я разработал метод Object для этой работы. Этот однострочный рекурсивный подход динамически обращается к любому значению в структуре объекта массива независимо от того, насколько глубоко оно вложено. Согласно вашему примеру

var fields = [
  {fieldName:'user.firstName',fieldLabel:'First Name',dsiabled:false},
  {fieldName:'user.location.lat',fieldLabel:'Latitude',dsiabled:false},
  {fieldName:'user.location.long',fieldLabel:'Latitude',dsiabled:false}
];

Object.prototype.getNestedValue = function(...a) {
  return a.length > 1 ? (this[a[0]] !== void 0 && this[a[0]].getNestedValue(...a.slice(1))) : this[a[0]];
};

document.write(fields.getNestedValue(0,"fieldName"));

Для более глубоко структурированного объекта вы всегда можете сделать как

Object.prototype.getNestedValue = function(...a) {
  return a.length > 1 ? (this[a[0]] !== void 0 && this[a[0]].getNestedValue(...a.slice(1))) : this[a[0]];
};

var arr = [{fox: [{turn:[857, 432]}]}, {sax: [{pana:[777, 987]}]}, {ton: [{joni:[123, 567]}]}, {piu: [{burn:[666, 37]}]}, {sia: [{foxy:[404, 696]}]}],
  myObj = { foo : 1, bar: { baz : 2 }, bee : 3 };

document.write(arr.getNestedValue(3,"piu",0,"burn",1));