单击thingboard中自定义时间序列小部件的行时，如何在对话框中获取并显示特定数据键的值

问题描述

我希望每当我单击自定义时间序列小部件的行时，它应该打开对话框并显示属性/时间序列键的值。

例如：我创建了一个自定义时间序列小部件，如图 [1]：https://i.stack.imgur.com/YPGtc.png [自定义时间序列小部件][1] 其中实体的 dataKey 的名称是“链接”及其类型是“时间序列”，我的要求是，每当我点击时间序列小部件的行时，就会打开一个对话框，并在对话框中显示数据键的值，即链接的值（以“https：/ /"在图像中）

我已经尝试使用下面提到的自定义操作代码，但没有用

var
    types = $injector.get('types'),attributeService = $injector.get('attributeService'),$q = $injector.get('$q'),$mddialog = $injector.get('$mddialog'),$filter = $injector.get('$filter'),$document = $injector.get('$document');
getInfoAttributes().then((attributes) =>{
    showInfoDialog(attributes);
},() =>{showFailedDialog('Unable to get info attributes.');})
;

function
showInfoDialog(attributes) {
    $mddialog.show({
        controller: ['attributes','$mddialog',InfoDialogController],controllerAs: 'vm',template: infoDialogTemplate,parent: angular.element($document[0].body),locals: {
            attributes: attributes
        },targetEvent: $event,clickOutsidetoClose: false,fullscreen: true
    }).then(() => { openUrlDetails();});
}

var
    infoDialogTemplate = '<md-dialog aria-label="Info">' +
        '<form name="theForm">' +
        '<md-toolbar>' +
        '<div class="md-toolbar-tools">' +
        '<h2>{{vm.entityTitle}}</h2>' +
        '<span flex></span>' +
        '<md-button class="md-icon-button" ng-click="vm.close()">' +
        '<ng-md-icon icon="close" aria-label="Close"></ng-md-icon>' +
        '</md-button>' +
        '</div>' +
        '</md-toolbar>' +
        '<md-dialog-content>' +
        '<md-content class="md-padding">' +
        '<div layout="column" flex>' +
        '<div><h3>{{vm.link}}</h3></div>' +
        '<div layout="row">' +
        '<md-button class="md-raised md-primary" ng-click="vm.openDetails()">' +
        'Url details' +
        '</md-button>' +
        '<span flex></span>' +
        '</div>' +
        '</div>' +
        '</md-content>' +
        '</md-dialog-content>' +
        '<md-dialog-actions layout="row">' +
        '<span flex></span>' +
        '<md-button ng-click="vm.close()" style="margin-right:20px;">Close</md-button>' +
        '</md-dialog-actions>' +
        '</form>' +
        '</md-dialog>';

function
InfoDialogController(attributes,$mddialog) {
    let vm = this;
    vm.entityTitle = entityName;
    vm.link = getAttributeValue(attributes,'link');
    vm.close = () =>
    {
        $mddialog.cancel();
    }
    vm.openDetails = () =>
    {
        $mddialog.hide();
    }
}

function
getAttributeValue(attributes,key) {
    var foundAttributes = $filter('filter')(attributes,{key: key},true);
    if (foundAttributes.length > 0) {
        return foundAttributes[0].value;
    } else {
        return null;
    }
}

function
openUrlDetails() {
    var params = {
        entityId: entityId,entityName: entityName
    }
    widgetContext.stateController.openState('default',params,false);
}

function
getInfoAttributes() {
    var deferred = $q.defer();
    attributeService.getEntityAttributesValues(entityId.entityType,entityId.id,types.attributesScope.server.value,'link',{
            ignoreLoading: true
        }
    ).then((attributes) => {
        if(attributes && attributes.length
)
    {
        deferred.resolve(attributes);
    }
else
    {
        deferred.reject();
    }
},() =>
    {
        deferred.reject();
    }
)
    ;
    return deferred.promise;
}

function
showFailedDialog(content) {
    $mddialog.show(
        $mddialog.alert().parent(angular.element($document[0].body)).clickOutsidetoClose(true).title(`Unable to display info for ${entityName}`).textContent(content).ariaLabel('Action Demo Dialog').ok('Close').targetEvent($event)
    )
    ;
}```


  

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）