Angularjs 1 How to Initialize Form Input Field Example

Angularjs Initializing Form Input Field

You are Welcome! Here below you find detailed instructions on How to Initialize Form Input Field on Angular.js 1.x.

The Solution include an Example of a View with an associated Controller.

Especially relevant: the default Angular Binding by the “{{ }}” is Not Suited for Passing Data to Initialize the Forms Fields.

View like:

<form id="editLocation" name="editLocation" role="form" ng-submit="vm.onSubmit()">
	<div class="form-group">
		<input id="name" name="name" ng-model="vm.formData.name"/>
		<input id="address" name="address" ng-model="vm.formData.address" />
	</div>
	<button type="submit">Submit location</button>
</form>

Controller as:

angular
	.module('myApp')
	.controller('editLocationCtrl', function editLocationCtrl($scope) {

	var vm = this;
	$scope.vm.formData = {
			name: "Zoc Hardy",
			address: "1600 Pennsylvania Ave NW, Washington, DC 20500, USA"
	}

});

Thanks to: stackoverflow

Leave a Reply

Your email address will not be published. Required fields are marked *