Javascript 链接div和div选择上的文本框值

我正在尝试将div与textbox同步

比如说,，我创建了2个节点，即节点1和节点2，当我选择节点1并输入标题和位置时，标题和位置应与节点1同步，因此当我在选择节点1时输入标题时，标题值应反映在节点1上，在下次输入标题和位置后，当我选择节点1时，标题和位置值应为反映在我的文本框中

我创建了下面的小提琴来演示这个问题：

---

我不知道怎么做。

您需要将表单元素与附加到树中的数据绑定在一起。 检查此代码段

var-app=angular.module（“myApp”，[]）；
应用控制器（“树控制器”，功能（$scope）{
$scope.delete=函数（数据）{
data.nodes=[]；
};
$scope.add=函数（数据）{
var post=data.nodes.length+1；
var newName=data.name+'-'+post；
push（{name:newName，nodes:[]，selected:false，myObj:{name:newName}}）；
};
$scope.tree=[{name:“节点”，节点：[]，所选：false}]；
$scope.setActive=函数（$event，data）{
$event.stopPropagation（）；
$scope.selectedData=数据；
clearDivSelection（$scope.tree）；
data.selected=true；
};
功能选择（项目）{
items.forEach（功能（项目）{
item.selected=false；
if（item.nodes）{
clearDivSelection（item.nodes）；
}
});
}
});
ul{
列表样式：圆形；
}
李{
左边距：20px；
}
.active{背景色：#ccffcc；}



{{data.myObj.name}
添加节点
删除节点



标题：
地点：
感谢您为帮助我所做的努力。在您的代码中，为每个节点生成选定的数据？不。selectedData是作用域中的单个变量，每次执行函数setActive时都会分配该变量，该函数绑定在每个li元素的单击事件中。是否可以有一个存储标题的对象，与每个节点关联的位置允许您获取范围中的数据结构，并仅将其绑定到所需属性的视图。除了当前推送对象之外，在推送语句中执行add Function时，还可以绑定这两个属性。push（{name:newName，location:newLocation，nodes:[]，selected:false}）；我有myObj来存储标题和位置：data.nodes.push（{name:newName，nodes:[]，selected:false myObj:{}）；那么现在setactive函数的变化是什么呢？
$scope.add = function (data) {
                var post = data.nodes.length + 1;
                var newName = data.name + '-' + post;
                data.nodes.push({ name: newName, nodes: [],selected : false });
            };
            $scope.tree = [{ name: "Node", nodes: [], selected: false }];

            $scope.setActive = function (data) {
                clearDivSelection($scope.tree);
                console.log(data);
                data.selected = true;
            };