不使用检查JointJS / Rappid变化督察/细胞模型值 [英] JointJS/Rappid change inspector/cell model value without using inspector

问题描述

所以我想不使用检查更新的文本属性（名称）的细胞模型的价值，我需要这个更新两个督察场和链接细胞模型的价值。不知道如何做到这一点。这可能吗？

So I'm trying to update the value of a the text attribute (name) in a cell model without using the inspector, I need this to update both the inspector field and linked cell model value. No idea how to do this. Is it possible?

推荐答案

这是一个有点分不清正是你从你的问题是什么意思，再加上我没有Rappid许可证，所以我不能测试UI督察部分：O（不过假设我理解你正确...

It is a little hard to tell exactly what you mean from your question, plus I don't have a Rappid license so I can't test the UI Inspector part :o( However assuming I understand you properly...

...如果你有一个属性延伸形状的原型，你可以再数据绑定给它的角正常，当你更改的属性就自动地更新形状。

...if you extend the prototype of a shape with a property you can then databind to it in Angular as normal and it automagically updates the shape as you change the property.

我的猜的，这也将更新检查细胞太多，但我不能对此进行测试，因为我没有Rappid牌照我说。

I guess this will also update the inspector cell too, but I can't test this because I don't have a Rappid license as I said.

所以，如果你的名称属性添加到形状是这样的：

So if you add a name property to a shape like this:

  Object.defineProperty(joint.shapes.basic.Rect.prototype, 'name', {
      get: function () { return this.attr('text/text'); },
      set: function (value) { this.attr('text/text', value); }
  });

您可以暴露你要编辑您的控制器范围和绑定到它的元素。该HTML：

You can expose the element you want to edit on your controllers scope and bind to it. The HTML:

<div ng-app>
  <div ng-controller="MyCtrl">
    <div id="paper"/>
    <div>
      <label>Type here:</label>
      <input type="text" ng-model="element.name"  />
    </div>
  </div>
</div>

控制器：

function MyCtrl($scope) {

  var graph = new joint.dia.Graph;
  var paper = new joint.dia.Paper({
      el: $('#paper'),
      width: 400,
      height: 400,
      model: graph,
      gridSize: 1,
      interactive: false
  });

  var element = new joint.shapes.basic.Rect({
      position: {x:100, y:30},
      attrs: {text: {text: 'edit my name'}},
      size: { height: 92.7051, width: 150}
  });

  $scope.element = element;

  graph.addCell(element);

  Object.defineProperty(joint.shapes.basic.Rect.prototype, 'name', {
      get: function () { return this.attr('text/text'); },
      set: function (value) { this.attr('text/text', value); }
  });

}

在这里工作的jsfiddle： http://jsfiddle.net/r7n9t9s6/3/

这篇关于不使用检查JointJS / Rappid变化督察/细胞模型值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！