Как использовать динамически генерируемое значение в шаблоне в AngularJS

Question

У меня есть приложение для пользовательских форм, написанное в AngularJS, и теперь мне нужно использовать данные из формы в шаблоне. Но ничего, что я пробовал, похоже, работает.

Я создаю пользовательские директивы, как это ...

.directive('dynamicModel', ['$compile', function ($compile) { 
    return { 
     'link': function(scope, element, attrs) { 
      scope.$watch(attrs.dynamicModel, function(dynamicModel) { 
       if (attrs.ngModel == dynamicModel || !dynamicModel) return; 

       element.attr('ng-model', dynamicModel); 
       if (dynamicModel == '') { 
        element.removeAttr('ng-model'); 
       } 

       // Unbind all previous event handlers, this is 
       // necessary to remove previously linked models. 
       element.unbind(); 
       $compile(element)(scope); 
      }); 
     } 
    }; 
}]) 

Это присоединяется к элементу формы, как это ..

<div class="row" ng-repeat="field in customForm.fields"> 
<label>{{field.displayname}} 
     <input class="form-control" type="{{field.type}}" name={{field.variable}} dynamic-model="field.databind" placeholder="{{field.variable}}" required="{{field.isRequired}}"></label></div> 

Эта часть работает отлично, поле теперь 2 связанный с формой ввода. Однако, когда я позже попытался использовать тот же метод, чтобы показать значение в отчете, вычисленном из формы, я получаю «field.databind» или в лучшем случае разрешенное имя поля данных, например «currentUser.name», а не значение, например «Devlux»

Я попытался

<div class="row" ng-repeat="field in customForm.fields"> 
<p>{{field.name}} = {{field.databind}}</p> 
Also 
<p dynamicModel="field.databind"></p> 
</div> 

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

Код динамической модели был снят с того, что кто-то elses ответил на вопрос о создании элементов динамической формы, и, честно говоря, я думаю, что это всего лишь шаг за пределами моего понимания. Но если предположить, что «field.databind» всегда будет строковым литералом, содержащим имя модели для подсмотра, как я могу получить доступ к нему в обычном шаблоне?

Answer 1

{{field.databind}} будет оцениваться в соответствии с текущим $scope и приведет к тому, что $scope.field.databind является, например, строкой currentUser.name.

Угловой не знает, что currentUser.name - это не нужная вам строка, а фактически другое выражение, которое вы хотите оценить.

Чтобы снова просчитать его, вам нужно будет добавить функцию к вашему $scope, который использует службу $parse.

Например:

$scope.parseValue = function (value) { 
    return $parse(value)($scope); 
}; 

В HTML:

<div class="row" ng-repeat="field in customForm.fields"> 
    <p>{{field.displayname}} = {{parseValue(field.databind)}}</p> 
</div> 

Аргумент, который получает передается parseDynamicValue воли, например, быть currentUser.name. Затем он использует службу $parse, чтобы оживить выражение против текущего $scope, что приведет, например, к devlux.

Демо:http://plnkr.co/edit/iPsGvfqU0FSgQWGwi21W?p=preview