Angular - 在json对象中选择数组

时间:2013-10-08 17:11:19

标签: json angularjs

我有一个数组的json对象,如下所示:

[
    {
        "id": 1,
        "name": "John Smith",
        "age": 52
    },
    {
        "id": 2,
        "name": "Jane Walters",
        "age": 43
    },
    {
        "id": 3,
        "name": "Mike Wilson",
        "age": 65
    },
    {
        "id": 4,
        "name": "Tom Samuels",
        "age": 29
    }
]

我在“索引”页面上显示所有这些名称,我想在每个“character / [id]”页面上只显示一个。这是索引页面的控制器:

angular.module('myApp.controllers', []).
    controller('index', ['$scope', 'characters', function($scope, c){
        $scope.characters = c.getCharacters;
    }]);

Aaand这里是“人物”服务:

factory('characters', function($resource){
    return $resource('JSON/characters.json', {}, 
    {
        'getCharacters':    {method: 'GET', isArray:true}
    }); 
});

视图是标准样板。

我的问题是,如何为“character / [id]”路由创建服务(或操纵控制器中的对象),以便它只根据JSON id选择一个数组?

我在angularjs.org上做过phonecat演示,但该演示为每部手机使用单独的JSON文件,然后为索引页面使用一个大的JSON文件。我想避免这种情况。

最后一件事:我正在使用angular-seed,所以我想维护那里使用的语法。我尝试了很多不同的方法而没有运气。

2 个答案:

答案 0 :(得分:1)

我自己的项目中的例子:

控制器:

app.controller("prodDetalleController", ["$scope","$http","$routeParams", function($scope,$http,$routeParams ){    

  vm = this;
  $scope.id = $routeParams.idProducto;


    // Listado de productos
    $http.get("_producto.php?id="+$scope.id)
    .success(function (respuesta) 
    {
        vm.producto = respuesta;}
    )
    .error(function(){
        vm.producto = "Error: no hay datos.";
    }); 

}]); // fin ctrl

在PHP中:

<?php

 $id = $_GET['id'];
 //echo $id;

$conn = @new mysqli('localhost', 'root','buenosaires','martin_db');

$result = $conn->query("SELECT * FROM productos WHERE idProducto=$id");

$myArray = array();

...

并且在视野中:

{{producto.titulo}}
{{producto.descripcion}}

...

答案 1 :(得分:0)

基本上,你问的是如何从路线网址获取id。

定义您的角色路线路径,如:

/character/:id

和你的角色控制器一样

....controller('characterCtrl', ['$scope', 'characters','$routeParams' function($scope, c,$params){
    $scope.characters = c.getCharacters;
    //you have $params.id here as the id from the url
}]);

在注释行上循环遍历$scope.characters以找到具有匹配id的那个并将其设置为另一个范围变量。 在帮助时,使用当前页面/视图和控制器的jsFiddle可能更有用。