Skip to content

Instantly share code, notes, and snippets.

@abjerner
Created August 26, 2016 19:33
Show Gist options
  • Save abjerner/a2b1cf55eab147dbcff2b68e79e04090 to your computer and use it in GitHub Desktop.
Save abjerner/a2b1cf55eab147dbcff2b68e79e04090 to your computer and use it in GitHub Desktop.
Example on an Umbraco property editor with a content picker (both single and multi)
<div ng-controller="ContentPickerDemo.Controller">
<div>
<a href="#" prevent-default ng-click="addSingle()" class="btn btn-default">Add single</a>
<a href="#" prevent-default ng-click="addMultiple()" class="btn btn-default">Add multiple</a>
</div>
<div ng-show="model.value.items.length > 0" style="margin-top: 10px;">
<div ng-repeat="item in model.value.items">
<i class="icon {{item.icon}}"></i> {{item.name}}
<a href="#" prevent-default ng-click="remove($index)"><i class="icon icon-delete red"></i></a>
</div>
</div>
</div>
angular.module('umbraco').controller('ContentPickerDemo.Controller', function ($scope, dialogService) {
if (!$scope.model.value) {
$scope.model.value = {
items: []
};
}
$scope.addSingle = function () {
dialogService.contentPicker({
callback: function (item) {
$scope.model.value.items.push({
id: item.id,
icon: item.icon,
name: item.name
});
}
});
};
$scope.addMultiple = function () {
dialogService.contentPicker({
multiPicker: true,
callback: function (items) {
angular.forEach(items, function (item) {
$scope.model.value.items.push({
id: item.id,
icon: item.icon,
name: item.name
});
});
}
});
};
$scope.remove = function(index) {
$scope.model.value.items.splice(index, 1);
};
});
{
"propertyEditors": [
{
"alias": "ContentPickerDemo",
"name": "ContentPickerDemo",
"editor": {
"view": "~/App_Plugins/ContentPickerDemo/Views/ContentPickerDemo.html",
"hideLabel": false,
"valueType": "JSON"
}
}
],
"javascript": [
"~/App_Plugins/ContentPickerDemo/Controllers/ContentPickerDemo.js"
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment