Angular ng-model not binding to textarea

Question

I am working with Angular 1.5 and am having trouble getting my textarea to bind to the model and access it in the controller.

In my controller I am initializing a variable :

$scope.textModel = "";

and in my template I have :

<textarea ng-model="textModel"></textarea>

If I put in my template :

<div>{{textModel}}</div>

under the textarea I can see what is being typed. However in a function that gets called on button click I cannot see the value of $scope.textModel

$scope.onButtonClick = function() {
  var x = $scope.textModel; // gets assigned as ""  
}

Not sure what I'm missing here....

Sample code

export default (TestService) => {
     return TestService.show({
        template: (() => { 
            let modalHeader = `
            <modal-header-content>
                <div ng-if="!editing">
                    <textarea ng-model="textInput" placeholder="Add "></textarea>
                    <button type="button" class="btn btn-accent" ng-click="methods.addObj()">Add</button>
                </div>
            </modal-header-content>
            `;
            return [
                '<modal-template>',
                modalHeader,
                '</modal-template>'
            ].join('');
        })(),
        controller: ($scope) => {

            $scope.textInput = "";
            $scope.testArray = [];

            $scope.methods = {
                addObj: () => {
                    let newObj = {};
                    newTribute.message = $scope.textInput; //getting set as ""
                    $scope.testArray.push(newObj);
                    $scope.textInput = '';
                }
            }
        }
     })
}