angularjs对象数组的单一形式

Question

我在控制器中有以下数据-

$scope.template1 = {
    name: 'template1',
    blocks: [
        { id: 1, display: true, title: 'News' },
        { id: 2, display: true, title: 'News' },
        { id: 3, display: true, title: 'News' },
        { id: 4, display: true, title: 'News' },
        { id: 5, display: true, title: 'News' }
    ]
};

块数据用于使用ng-repeat创建信息块，单击它时，我想显示表单以编辑其详细信息。

一种方法是执行ng-repeat并为每个块创建单独的表单。但相反，我希望有一个通用的表单，当用户更改数据时，这些更改需要反映为实时预览。我尝试过动态生成这些表单，但绑定不起作用：（

有谁能帮忙或举个例子吗？

感谢

Answer 1

将所选块的引用保存在范围变量中，并将其绑定到输入元素。

标记

<div ng-app ng-controller="TestController" style="padding:10px;">
    <div ng-repeat="block in template1.blocks" class="blocks" ng-click="vm.selectedBlock = block">
        <span>{{block.title}}</span>
    </div>
    <div style="clear:both" data-ng-show="vm.selectedBlock">
        <input type="text" ng-model="vm.selectedBlock.title" />
    </div>
</div>

控制器

function TestController($scope) {
    $scope.template1 = {
        name: 'template1',
        blocks: [
            { id: 1, display: true, title: 'News' },
            { id: 2, display: true, title: 'News' },
            { id: 3, display: true, title: 'News' },
            { id: 4, display: true, title: 'News' },
            { id: 5, display: true, title: 'News' }
        ]
    };
    $scope.vm = {}
}

工作Fiddle