ng-repeat 表中的 Angularjs 复选框

Question

我使用 angularjs 从带有复选框的 json 记录中显示表格，我有两个问题：

首先：我需要所有复选框默认为真。用 ng-init 测试但不工作。或者只是一个按钮来切换所有复选框的真假

第二当取消选中文件时，对象显示引号[“”，“”，“”]，但如果没有选中，我需要显示任何内容

查看

<div ng-controller="TestController">
<table class="table table-striped">
                <tr>
                    <th>Seleccionar</th>
                    <th>Servicio</th>
                    <th>Detalle</th>
                    <th>Precio</th>
                </tr>
                <tr ng-repeat="(key, value) in listado">
                    <td><input type="checkbox" ng-model="ids[$index]" ng-true-value="{{value}}" ng-false-value="{{ undefined }}" ng-selected="checkAll"></td>
                    <td>{{ value.modelo }}</td>
                    <td>{{ value.detalle }}</td>
                    <td>{{ value.precio_in | currency:'$':0 }}</td>
                </tr>               
            </table>
            {{ ids | json }}

控制器

var myApp = angular.module('myApp', [])
.controller('TestController', ['$scope', function ($scope) {

$scope.listado = [];
$scope.ids = [];

    $scope.listado = [ { "id_stock": "4", "oc_id": "4", "detalle": "Revisión de suspención", "cat_id": "16", "codigo": "m20.1", "marca": "", "parte": "", "precio_in": "5000", "id_prov": "1", "cantidad": "1", "id_bodega": "1", "nom_prov": "Proveedor de prueba 1", "modelo": "MECANIZADOS Y OTROS", "nombre": "Bodega Conchalí", "status": "EN BODEGA", "id_cat": "16" }, { "id_stock": "5", "oc_id": "4", "detalle": "Revisión de frenos", "cat_id": "16", "codigo": "m2.2", "marca": "", "parte": "", "precio_in": "4500", "id_prov": "1", "cantidad": "1", "id_bodega": "1", "nom_prov": "Proveedor de prueba 1", "modelo": "MECANIZADOS Y OTROS", "nombre": "Bodega Conchalí", "status": "EN BODEGA", "id_cat": "16" }, { "id_stock": "6", "oc_id": "4", "detalle": "Revisión de ruedas", "cat_id": "16", "codigo": "m20.3", "marca": "", "parte": "", "precio_in": "4500", "id_prov": "1", "cantidad": "1", "id_bodega": "1", "nom_prov": "Proveedor de prueba 1", "modelo": "MECANIZADOS Y OTROS", "nombre": "Bodega Conchalí", "status": "EN BODEGA", "id_cat": "16" }]; }]);   

检查代码 http://jsfiddle.net/eCJ47/44/

对不起，英语不是我的母语。谢谢！！

Answer 1

稍微修改您的代码，而不是将对象分配给新数组，而是将新属性 isSelected 添加到现有 listado 数组并绑定到复选框并将其默认初始化为 true。

            <tr ng-repeat="(key, value) in listado" ng-init="value.isSelected = true;">
                <td><input type="checkbox" ng-model="value.isSelected"></td>
                <td>{{ value.modelo }}</td>
                <td>{{ value.detalle }}</td>
                <td>{{ value.precio_in | currency:'$':0 }}</td>
            </tr>

打印listado 以验证复选框更改

Plunkerhttp://jsfiddle.net/Vinthi/4atbzo6L/3/