2013-10-08 112 views
1

我有陣列的JSON對象,看起來像這樣:角 - 在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 
    } 
] 

我的「索引」頁面上顯示所有這些名字,我想只顯示一個每個「字符/ [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} 
    }); 
}); 

的觀點爲標準的樣板。

我的問題是,如何爲「字符/ [id]」路由創建一個服務(或操縱控制器中的對象),以便它只根據JSON ID選擇一個數組?

我在angularjs.org上做了phonecat演示,但是演示程序爲每個手機使用單獨的JSON文件,然後爲索引頁使用了一個大的JSON文件。我想避免這種情況。

最後一件事:我正在使用angular-seed,所以我想保留那裏使用的語法。我嘗試了很多不同的方法,但沒有運氣。

回答

0

基本上,你問的是如何從路由URL獲取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和設置,爲另一個範圍變量。 js當前頁面/視圖和控制器可以在幫助時更有用。

+0

我會遍歷控制器中的數組,但它是空的,直到在瀏覽器中加載 – symlink

1

例如在我自己的proyect:

控制器:

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

...