PLUNKER: https://plnkr.co/edit/IQpGhinzsHUUqmwbHFmQ?p=preview
Я пытаюсь создать форму, которая читает из некоторого JSON и создает соответствующее представление.Каждый набор вопросов находится в своем собственном шаге.У меня возникают проблемы при получении доступа к каждому input для проверки его с помощью AngularJS.
Как получить доступ к модели answers, созданной в цикле forEach?
HTML:
<form ng-app="MyApp" novalidate >
<section class="question step " ng-controller="StepController">
<div class="step-contents">
{{title}}
<step-contents content="content" ></step-contents>
</div>
<button >Prev</button>
<button ng-click="nextStep(content)">Next</button>
</section>
</form>
My AngularJS:
var app = angular.module('MyApp', []);
app.controller('StepController', function($scope) {
$scope.index = 0;
$scope.nextStep = function() {
console.log($scope.answers); // This should be the input data for _THIS_ step only
}
$scope.showStep = function() {
//FOREACH HAPPENS HERE
// Loops over some JSON to generate the following HTML:
$scope.title = "Step 1 title";
var html = '<input type="number" ng-model="answers.amount" />';
html += '<input type="text" ng-model="answers.name" />';
$scope.content = html;
//FOREACH ENDS HERE
}
$scope.showStep();
});
app.directive('stepContents', function ($compile) {
var linker = function(scope, element, attrs){
element.html(scope.content);
$compile(element.contents())(scope);
};
return {
restrict: 'E',
link: linker,
scope: {
content: '=',
},
};
});