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

将所选块的引用保存在作用域变量中，并将其绑定到input元素。

<强>标记

<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 = {}
}

Working Fiddle

angularjs对象数组的单一形式

1 个答案: