javascript - Is it possible to model bind an entire object in an Angular controller method? -

i have following interface defined in typescript:

interface person {     id: number;     firstname: string;     lastname: string;     age: number; } 

i have .html partial contains angular ng-submit="submit()" directive on html form element. here example element inside form:

<input id="firstname" name="firstname" type="text" class="form-control" ng-model="firstname" placeholder="enter first name" /> 

what i'd have following call on sumbit map form values object argument on submit call below:

$scope.submit = (person: myapp.models.person) => {   //access person values } 

the problem when inspecting person value on calling submit() undefined , not populated.

i'd know if it's possible have multiple <input> form values within form element automatically used , bound object argument known typescript in submit() method?

the answer may entirely not possible, i'd know before manually have each ng-model value , hydrate person instance within submit() function.

it possible. , some recommended strategy.

rather use members of person object directly on form elements (ng-model=firstname), use dot notation person object (ng-model=person.firstname). example on scope object:

$scope.person: myapp.models.person; 

and in markup (note difference on ng-model):

<input id="firstname" name="firstname" type="text" class="form-control" ng-model="person.firstname" placeholder="enter first name" /> 

now when call submit function, can send person model

ng-submit="submit(person)" 

and submit function person parameter have access members of person object defined on form.