Angularjs директива за промяна на ng-model - javascript, angularjs, angularjs-directive

Аз правя директива, която имитира а <select>, но ми позволява повече стилизиране, но не можах да намеря никаква информация за това как да я приложа, използвайки ng-модел. Ето директивата:

.directive("customSelect", [function() {
return {
restrict:"EA",
require: "ngModel",
scope:{
choices:"=",
selected:"="
},
template:"
<div class="custom-select">
<div class="label">{{ selected }}</div>
<ul>
<li data-ng-repeat="choice in choices" data-ng-click="ngModel = choice">{{ choice }}</li>
</ul>
</div>",
replace:true
}
}])

Как мога да задам ng-модел от събитието за кликване на <li> ?

Отговори:

Опитвам ngModel.$setViewValue:

app.directive("customSelect", [function() {
return {
restrict:"EA",
require: "?ngModel",
scope:{
choices:"=",
selected:"@"
},
link:function(scope,element, attrs,ngModel){
scope.select = function (choice){
ngModel.$setViewValue(choice);
}
},
templateUrl:"template.html",
replace:true
}
}])

Шаблон:

<div class="custom-select">
<div class="label">{{ selected }}</div>
<ul>
<li data-ng-repeat="choice in choices" data-ng-click="select(choice)">{{ choice }}</li>
</ul>
</div>

ДЕМОНСТРАЦИЯ (кликнете върху елемент, за да видите изход)