Looking to access a form object within my controller. The form is located inside an ng-repeat block with a dynamic name, and I should be able to access it since version 1.3.
JavaScript:
var app = angular.module('app', []);
app.controller('AppCtrl', ['$scope', function($scope) {
$scope.forms = [0];
$scope.testForm = function() {
if($scope.form0 == undefined) {
$scope.test = 'Form is NOT defined';
} else {
$scope.test = 'Form is defined';
}
}
}])
HTML:
<body ng-app="app">
<div ng-controller="AppCtrl">
<div ng-repeat="form in forms" ng-init="formName = 'form' + $index">
form name should be {{formName}}
<form name="{{formName}}">
<input type="text" name="field" />
</form>
</div>
<button ng-click="testForm()">Check if form exists</button>
<p ng-bind="test"></p>
</div>
</body>
However, in my controller, $scope.form0 remains undefined - after clicking "Check if form exists", I continue to receive the message "Form is NOT defined". Even when I manually assign a static name (<form name="form0">
), it still returns undefined. Removing the form from the ng-repeat loop allows it to work properly.
Any insights into why this is happening?
See the example here: https://plnkr.co/edit/Fvy5LdIO0H1vCS9wYR0U?p=preview
Thank you!