AngularJS: Some form fields not bound with viewmodel - angularjs

Question

I'm writing a form that binds inputs with a angularJS model. For some reason, only certain fields are bound to the model (vm.customer). For example, vm.last_name, and vm.email are bound. But vm.first_name and vm.gender are not bound from inputs to model.
/* AddCustomer.js */
(function (angular) {
'use strict';
angular.module('app', []);
function controller($scope) {
var vm = this;
vm.genders = ["Male", "Female", "Other"];
vm.customer = {
first_name: 'Susan',
last_name: 'BOyle',
email: 's.boyle#singwell.com',
ip_address: '192.168.1.120',
gender: vm.genders[1]
}
vm.addCustomer = function($scope) {
console.log("bout to add a user");
};
vm.$onInit = function() {
};
}
// dep. injecion
controller.$inject = ['$scope'];
angular
.module('app')
.controller('AddCustomer', controller);
})(window.angular);
This is the html file
/* add-customer-view.html */
<form ng-app="app" ng-controller="AddCustomer as vm">
<pre>
customer = {{ vm.customer | json }}
</pre>
<div class="form-row">
<div class="form-group col-md-6">
<label>First</label>
<input class="form-control" type="text" ng-model"vm.customer.first_name" ng-model-options="{ updateOn: 'blur' }">
</div>
<div class="form-group col-md-6">
<label>Last</label>
<input class="form-control" type="text" ng-model="vm.customer.last_name">
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label class="col-form-label">Email</label>
<input class="form-control" type="email" ng-model="vm.customer.email">
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<div class="form-check form-check-inline" ng-repeat="gender in vm.genders">
<input type="radio" name="gender" ng-model"vm.customer.gender" value="vm.genders[{{$index}}]">
<label class="form-check-label">{{ gender }}</label>
</div>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label class="col-form-label">IP Address</label>
<input class="form-control" type="text" ng-model="vm.customer.ip_address">
</div>
</div>
<div class="form-row">
<button type="submit" class="btn btn-primary" ng-click="vm.addCustomer()">Add Customer</button>
</div>
Link to code segments: https://codepen.io/nmnduy/pen/ypvddZ. Any insight would be very helpful!

Answer 1

1) You miss = operator on both cases (first_name, gender)
2) You need to replace input's value as follows:
<input type="radio" name="gender" ng-model="vm.customer.gender" value="{{gender}}">