Function is always returning undefined - angularjs

Question

I have a problem where getCurrentOption is always returning undefined, and I can't for the love of coding figure out why. Because I have 2 other functions (coForms.toggleSelect and coForms.isSelectToggled) identical in functionality and they work fine.
For some reason select.currentOption is set correctly in coForms.selectOption but when I try and fetch the value in select.getCurrentOption it's not there anymore.. Is it losing a reference or something somewhere? I'm not too familiar with the controller as syntax nor hooking it up to a directive like this.
What is happening?
CoFormsCtrl:
var coForms = this;
coForms.toggleSelect = function(select) {
select.isToggled = !select.isToggled;
};
coForms.isSelectToggled = function(select) {
return select.isToggled ? true : false;
};
coForms.selectOption = function(select, option) {
select.currentOption = option;
};
/* This is always returning undefined atm, still search for the cause */
coForms.getCurrentOption = function(select) {
return select.currentOption;
};
Directive:
coForms.directive('coSelect', [function() {
return {
restrict: 'E',
scope: {
default: '=',
list: '=',
label: '#'
},
controller: 'CoFormsCtrl',
controllerAs: 'co',
templateUrl: 'app/views/components/co-forms/co-select.html',
link: function(scope, element, attrs) {
}
};
}]);
Directive template:
<div class="co-select-form-control">
<ul class="list-reset co-select">
<li ng-click="co.toggleSelect(this)" class="co-select-option clickable">
<span ng-bind="co.getCurrentOption(this) || default"></span>
<ul ng-show="co.isSelectToggled(this)" class="list-reset bg-light co-select-dropdown">
<li ng-repeat="option in list" ng-if="option !== co.getCurrentOption(this)"
ng-click="co.selectOption(this, option)" ng-bind="option" class="co-select-option"></li>
</ul>
</li>
</ul>
<span class="co-select-icon">
<i class="icon icon-keyboard-arrow-{{co.isSelectToggled(this) ? 'up' : 'down'}}"></i>
</span>
</div>
Then I just use it like this:
<co-select list="video.config.upload.status" default="video.config.upload.status[0]"></co-select>

Answer 1

Change this:
/* This is always returning undefined atm, still search for the cause */
coForms.getCurrentOption = function(select) {
return select.currentOption;
};
To this:
coForms.getCurrentOption = function(select) {
return select.currentOption || coForms.default;
};
In your directive, you have bound the default attribute of the directive's HTML to the default property of your controllers scope.
coForms.directive('coSelect', [function() {
return {
restrict: 'E',
scope: {
default: '=',
list: '=',
label: '#'
},
controller: 'CoFormsCtrl',
controllerAs: 'co',
templateUrl: 'app/views/components/co-forms/co-select.html',
link: function(scope, element, attrs) {
}
};
}]);