I'm trying to simplify a function in Thingsboard. I want to open a dialog when user clicks on a row of an Entity List (in or outside a dashboard). I've seen that you can use Angular's $mdDialog to do this. But I'm completely foreign to Angular and have no clue how to apply it.
I found this example code on github:
$mdDialog.show(
$mdDialog.alert()
.parent(angular.element(angular.element(self.ctx.$container))
.clickOutsideToClose(true)
.title('This is an alert title')
.textContent('You can specify some description text in here.')
.ariaLabel('Alert Dialog Demo')
.ok('Got it!')
.targetEvent(evt)
);
So I used this code in a custom action but it won't do anything. How can I use $mdDialog to create a new Popup Window in Thingsboard?
After reading a lot on AngularJS, and understanding the widget context, I learned that you need to extract each service from AngularJS into the widget context. The way to do it for this particular case is:
$mdDialog = widgetContext.$scope.$injector.get('$mdDialog')
And now the $mdDialog can be used as normal.
[EDIT] On Thingsboard v3+ they switched to an Angular 9/10 Wrapper for the UI. To achieve dialogs you can use:
widgetContext.customDialog.customDialog(htmlTemplate, controller).subscribe()
widgetContext.dialogs.alert(title, body, ok_message).subscribe()
The UI has several examples when adding a 'Custom Action with HTML' which can help you figure you out how to use them, and the UI for the editor provides helpful autocomplete and docu.