Angularjs ng-model value not updating in view when modified by another function

I'm creating a payroll app using AngularJS which contains a page where the user is able to edit start time and end time fields for a job as well as being able to change the end time by modifying another two fields (hours and minutes) which refer to the length of time worked on the job.

So far, I've been able to make the hours and minutes fields automatically update correctly when the user changes the start time or end time fields with the use of ng-change. I'm now trying to do things the other way around so that the end time is automatically updated based on the hours and minutes fields and although the variable which stores the end time is correctly updated, the input field displaying the end time doesn't change.

Here's the HTML for the four fields:

        <label class="item item-input">
            <span class="input-label">Start Time</span>
            <input type="time" class="item-input input-label editable" ng-model="data.startTimeObject" ng-change="updateHoursAndMinutes('start')"/>
        </label>
        <label class="item item-input">
            <span class="input-label">End Time {{data.endTimeObject.getHours()}}</span>
            <input type="time" class="item-input input-label editable" ng-model="data.endTimeObject" ng-change="updateHoursAndMinutes('end')" />
        </label>
        <label class="item item-input">
            <span class="input-label">Hours</span>
            <input type="number" class="item-input input-label editable" min="0" max="24" ng-model="editedRecord.hours" ng-change="updateEndTime()" />
        </label>
        <label class="item item-input">
            <span class="input-label">Minutes</span>
            <input type="number" class="item-input input-label editable" min="0" max="59" ng-model="editedRecord.minutes" ng-change="updateEndTime()" />
        </label>

And the relevant code from the updateEndTime() function:

$scope.updateEndTime = function(){
    .
    .
    .
    .

    $scope.data.endTimeObject.setHours(savedEndTimeHours + actualHourDifference);
    $scope.data.endTimeObject.setMinutes(savedEndTimeMinutes + actualMinuteDifference);
}

{{data.endTimeObject.getHours()}} next to the "End Time" label displays the hours correctly when updated from the updateEndTime() function but the field where the user can manually edit the end time doesn't automatically show the updated end time value.