尝试使用JSON数组中的属性(angularjs)

时间:2017-02-21 14:45:58

标签: javascript html angularjs arrays json

**更新:现在我感谢所有人的帮助,但是当字段为空时,我收到错误“无法读取属性'拆分'为空”我该怎么办?

我有这个JSON数据数组,只是一个带有2个对象的样本。

    {
    "proyecto": "Probando",
    "complejidad": "Media",
    "glosa": "QA",
    "inicio": "30-06-16",
    "termino": "27-09-16",
    "completado": "50",
    "esperado": "100",
    "estado": "Atrasado",
    "responsable": "Lionel Messi",
    "alerta": "01-02-2017 : Se define paso a produccion para el 18-02;\r\n\r\nAnalista responsable: Ronaldo ronald;\r\nEstado Actual: 13\/05 DEF firmado;\r\n\r\nServico curse credito internet, modificar el curse y el que envia la solicitus mod 2 servicos;"
}, {
    "proyecto": "Migracion",
    "complejidad": "Alta",
    "glosa": "QA",
    "inicio": "18-01-16",
    "termino": "22-04-77",
    "completado": "27",
    "esperado": "86",
    "estado": "Atrasado",
    "responsable": "Christiano ronaldo",
    "alerta": "08-02-2017 : Se define salida para 21 al 23 de abril, con dependencia de salida proyecto supercluster;"
}

这样就可以从angularjs

获取GET数据
$scope.llamada3 = function(){

    $http.get("conector.php?tipoDato=query3")
    .then(function(response) {
        $scope.mensajeEspera = "";
        $scope.datos3 = response.data;

我试图从中获取属性“alerta”,以便我可以将字段拆分为“;”结束但不起作用。我现在有这个

for(var i = 0; i < $scope.datos3.length; i++){
    var currentObj = $scope.datos3[i];
    currentObj.alerta[i] = $scope.datos3.currentObj[i].alerta.split(';');
}

在HTML中使用ng-repeat

<tr ng-repeat="z in datos3">
        <td style="vertical-align: top;"><a  href="#" ng-click="mostrar_proyecto(z.project_id)">{{z.proyecto}}</a></td>
        <td style="vertical-align: top;">{{z.complejidad}}</td>
        <td style="vertical-align: top;">{{z.glosa}}</td>
        <td style="vertical-align: top;">{{z.inicio}}</td>
        <td style="vertical-align: top;">{{z.termino}}</td>    
        <td style="vertical-align: top;">{{z.estado}}</td>
        <td style="vertical-align: top;">{{z.responsable}}</td>    
        <td style="vertical-align: top;"> 
             <div class="hooveralerta">
                <div ng-repeat="d in alerta">
                    {{d}}
                </div>
             </div>
        </td>

2 个答案:

答案 0 :(得分:0)

您正在使用$scope.datos3.currentObj[i].alerta.split(';');访问未定义的内容,并且您未将这些更改存储在$scope.dataos3

尝试更改循环以直接访问这些:

for(var i = 0; i < $scope.datos3.length; i++){
    $scope.datos3[i].alerta = (typeof $scope.datos3[i].alerta == 'string') 
        ? $scope.datos3[i].alerta.split(';') 
        : [];
}

以上内容只能在$http.get()完成之后或之后执行。

示例:

$http.get("conector.php?tipoDato=query3")
    .then(function(response) {
        $scope.mensajeEspera = "";
        $scope.datos3 = response.data;
        // Do the alteration here
        for(var i = 0; i < $scope.datos3.length; i++){
            $scope.datos3[i].alerta = (typeof $scope.datos3[i].alerta == 'string') 
                ? $scope.datos3[i].alerta.split(';') 
                : [];
        }
    };

答案 1 :(得分:0)

这里有几件事情要发生。首先,currentObj中没有datos3。所以这不会起作用:

currentObj.alerta[i] = $scope.datos3.currentObj[i].alerta.split(';');

相反,将其更改为

for(var i = 0; i < $scope.datos3.length; i++){
    var currentObj = $scope.datos3[i];
    currentObj.alertaObject = currentObj.alerta.split(';');
}

如果您想删除JSON对象中的换行符,可以包括:

for(var i = 0; i < datos3.length; i++){
    var currentObj = datos3[i];
    currentObj.alertaObject = currentObj.alerta.split(';');
    for (var j in currentObj.alertaObject) {
      currentObj.alertaObject[j] = currentObj.alertaObject[j].replace(/\n/g,'').replace(/\r/g,'');
    }
    console.log(currentObj.alertaObject);
}

最后,如果您在这里拥有的是实际的JSON,那么您的JSON无效,这可能会导致问题。您需要将两个单独的对象包含在一个包含对象中:

[{
    "proyecto": "Probando",
    "complejidad": "Media",
    "glosa": "QA",
    "inicio": "30-06-16",
    "termino": "27-09-16",
    "completado": "50",
    "esperado": "100",
    "estado": "Atrasado",
    "responsable": "Lionel Messi",
    "alerta": "01-02-2017 : Se define paso a produccion para el 18-02;\r\n\r\nAnalista responsable: Ronaldo ronald;\r\nEstado Actual: 13\/05 DEF firmado;\r\n\r\nServico curse credito internet, modificar el curse y el que envia la solicitus mod 2 servicos;"
}, {
    "proyecto": "Migracion",
    "complejidad": "Alta",
    "glosa": "QA",
    "inicio": "18-01-16",
    "termino": "22-04-77",
    "completado": "27",
    "esperado": "86",
    "estado": "Atrasado",
    "responsable": "Christiano ronaldo",
    "alerta": "08-02-2017 : Se define salida para 21 al 23 de abril, con dependencia de salida proyecto supercluster;"
}]

工作示例:https://jsfiddle.net/mspinks/yfyaehd7/