ThingsBoard：如何在單擊時打開對話框

Question

我正在嘗試簡化 Thingsboard 中的一個功能。 當用戶單擊實體列表的一行（儀表板內或儀表板外）時，我想打開一個對話框。 我已經看到你可以使用 Angular 的$mdDialog來做到這一點。 但我對 Angular 完全陌生，也不知道如何應用它。

我在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)
);

所以我在自定義操作中使用了此代碼，但它不會做任何事情。 如何使用$mdDialog在Thingsboard中創建一個新的彈出窗口？

Answer 1

在閱讀了大量關於 AngularJS 的內容並理解了小部件上下文后，我了解到您需要將 AngularJS 中的每個服務提取到小部件上下文中。 對於這種特殊情況，這樣做的方法是：

$mdDialog = widgetContext.$scope.$injector.get('$mdDialog')

現在 $mdDialog 可以正常使用了。

[編輯] 在 Thingsboard v3+ 上，他們為 UI 切換到 Angular 9/10 Wrapper。 要實現對話框，您可以使用：

widgetContext.customDialog.customDialog(htmlTemplate, controller).subscribe()
widgetContext.dialogs.alert(title, body, ok_message).subscribe()

在添加“帶有 HTML 的自定義操作”時，UI 有幾個示例，可以幫助您弄清楚如何使用它們，並且編輯器的 UI 提供了有用的自動完成和文檔。