Javascript 如何在单击JointJS中的链接时更新其标签？

几天来，我一直在努力解决这个问题。情况如下：

我希望当我点击我的图形链接时，我可以修改链接的标签。 到目前为止，我所能做的是，我有一个文本输入，在这里我写下我想要的文本，然后当我连接两个元素时，我创建的链接将有这个标签，但有点错误（主要是，我必须再次连接和断开一个元素，以便在链接中有我需要的标签）

我想，如果你知道哪种方法是合适的，这很容易做到，但我不知道（即使我一直在看医生）

这是我的js代码：

graph.on('change:source change:target', function(link) {
    if (link.get('source').id && link.get('target').id) {
        // both ends of the link are connected.
        $('#link-input').css('display', 'block');
        link.attr('text/text', $('#link').val());
    }
});

即使我认为这并不相关，HTML是这样的：

<div id="link-input" class="form-group">
    <label for="description">Link Condition</label>
    <textarea class="form-control" rows="5" id="link"></textarea>
</div>

链路条件

因此，我可以采用这样一种方法，即当我写入textinput时，它会特别刷新该链接（但不知何故，我知道我应该保留我正在修改的对象）。如果有人知道另一种方法，请说，我这样做是因为我不知道如何用另一种方法

---

感谢您的关注，我希望足够明确

您需要能够捕获链接视图上的指针单击事件

然后在pointerclick事件上打开一个文本框以获取输入并将其保存到链接属性

我为我的项目做了类似的事情

通过扩展普通链接创建新链接，同时扩展链接视图并覆盖pointerclick事件

  joint.shapes.deviceLink = joint.dia.Link.extend({

    vertexMarkup: [
        '<g class="marker-vertex-group" transform="translate(<%= x %>, <%= y %>)">',
        '<circle class="marker-vertex" idx="<%= idx %>" r="1" />',
        '</g>'
    ].join(''),


    defaults: joint.util.deepSupplement({
      type: 'deviceLink',
        connection: { name: 'orthogonal' },
        attrs: {
           '.connection': { stroke: '#fe854f', 'stroke-width': 6 },
            sourcePort:{text:''},
            targetPort:{text:''},
            '.link-tools .tool-remove circle': { r: 8, fill:'#fff',position: 0.5 },
            customLabel:{text:''},
        },
        labels: [ { position: 0.5, attrs: { text: { text: '' } } }  ]
    }, joint.dia.Link.prototype.defaults),
  });    

 joint.shapes.deviceLinkView = joint.dia.LinkView.extend({
   pointerclick: function (linkview, evt, x, y){
     prompt for new label and change your label 
this.model.label(0, { attrs: { text: { text: 'new label' } } });
  },
 });

joint.shapes.deviceLink=joint.dia.Link.extend({
顶点标记：[
'',
'',
''
].加入（“”），
默认值：joint.util.deepaddress({
键入：“deviceLink”，
连接：{name:'正交'}，
属性：{
'.connection'：{stroke:'#fe854f'，stroke width'：6}，
sourcePort:{文本：'}，
targetPort:{text:'}，
'.link tools.tool remove circle'：{r:8，fill:'#fff'，位置：0.5}，
customLabel:{文本：'}，
},
标签：[{位置：0.5，属性：{text:{text:{text:'''}}]
}，joint.dia.Link.prototype.defaults），
});    
joint.shapes.deviceLinkView=joint.dia.LinkView.extend({
指针单击：函数（链接视图、evt、x、y）{
提示输入新标签并更改标签
this.model.label（0，{attrs:{text:{text:'newlabel'}}）；
},
});

---

这个部分帮助我

.model.label（0，{attrs:{text:{text:{text:'newlabel'}}）