如何获取数组详细信息另一页

How to get array details another page

本文关键字:数组 详细信息 一页 获取 何获取      更新时间:2023-09-26

我有一个类别数组。还有更多的产品。我需要在类别页面中显示类别。当点击一个类别时,我必须重定向产品页面并显示必要的产品。当点击产品时,我必须重定向product_details页面并显示必要的产品详细信息。

类别加载到类别页面,当单击时,它将重定向产品页面。但是,我看不到产品。以及如何创建product_details.html页面

我必须这样显示:

  • 类别页面:term_id,名称
  • 产品页面:post_title,ID
  • 产品详细信息页面:post_title、post_date、post_author、ID

categorylist product.json

{
"category": [{
    "term_id": "10",
    "name": "Arden Grange",
    "slug": "arden-grange",
    "products": [{
        "ID": "47",
        "post_title": "Arden Grange, Premium",
        "post_date": "2015-10-20 16:13:04",
        "post_author": "5"
    }, {
        "ID": "50",
        "post_title": "Arden Grange Puppy'/Junior Large Breed",
        "post_date": "2015-10-21 04:56:23",
        "post_author": "5"
    }, {
        "ID": "53",
        "post_title": "Arden Grange Weaning'/Puppy",
        "post_date": "2015-10-22 12:52:35",
        "post_author": "5"
    }]
}, {
    "term_id": "8",
    "name": "Menu 1",
    "slug": "menu-1",
    "products": [{
        "ID": "38",
        "post_title": "Home",
        "post_date": "2015-10-20 10:43:44",
        "post_author": "1"
    }, {
        "ID": "30",
        "post_title": "",
        "post_date": "2015-10-20 10:13:56",
        "post_author": "1"
    }, {
        "ID": "31",
        "post_title": "",
        "post_date": "2015-10-20 10:13:57",
        "post_author": "1"
    }]
}]
}

类别控制器.js

app.controller('CategoryController', ['$scope','category', function($scope, category) {

category.success(function(data) {
     $scope.userslists = data;
  });
}]);

ProductController.js

app.controller('ProductController', ['$scope', '$routeParams', 'category', function($scope, $routeParams, category,products) {

category.success(function(data) {
$scope.users = data.category[$routeParams.id];

});
}]);

category.js(服务文件)

app.factory('category', ['$http', function($http) { 
return $http.get('http://localhost/youtubewebservice/shop-categorylist-product.php')
       .success(function(data) { 
          return data; 
        }) 
        .error(function(err) { 
          return err; 
        }); 
}]);

category.html

<ion-view>
<ion-content scroll="true" has-bouncing="false" class="has-header nk-colorGrey">
<div class="users" ng-repeat="users in userslists.category | filter:searchBox">
<a href="#/{{$index}}" style="text-decoration:none;">
    <ion-item    class="item widget uib_w_109 d-margins item-button-right" data-uib="ionic/list_item_button" data-ver="0">{{ users.name }} {{ users.post_title }}
        <label style="display:none;">{{ users.term_id }}</label>
        <form method="POST" style="display:none;">
            <input type="SUBMIT"  name="search" value="{{ users.term_id }}" />
            <input type="SUBMIT" name="submit" value="search" />
        </form>
        <button class="button button-balanced button-clear">
            <i class="icon ion-arrow-graph-up-right ion"></i>
        </button>
    </ion-item>
    <!--h2 class="name"> {{ users.age }} </h2-->

</a>
</div>
</ion-content>
</ion-view>

users.html(这是product.html页面)

<ion-view>
<ion-content scroll="true" has-bouncing="false" class="has-header nk-colorGrey">
<div class="users-detail">
<h2 class="users-name"> {{ users.name }} </h2>
<h2 class="name"> {{ product-post_title }} </h2>
<h2 class="users-name"> {{ users.name }} </h2>
  <h2 class="name"> {{ users.term_id }} </h2>
  <h2 class="name"> {{ users.term_id }} </h2>
</div>
</ion-content>
</ion-view>

app.js

var app = angular.module('LookApp', ['ionic','ngCordova','ngRoute']);
app.config(function($stateProvider, $urlRouterProvider,$routeProvider) {
  $routeProvider
.when('/', {
controller: 'CategoryController',
templateUrl: 'views/category.html'
  })
 .when('/:id', {
controller: 'ProductController',
templateUrl: 'views/users.html'
  })
.when('/login/:friendId', {
controller: 'LoginController',
templateUrl: 'views/login.html'
  })
.otherwise({
redirectTo: '/'
  });
});

您需要这样做
分类页面

<div class="users" ng-repeat="users in userslists.category | filter:searchBox track by $index" ng-click="save($index)">

controllers.js

app.controller('CategoryController', ['$scope','$http', function($scope, category) {
$http.get('http://localhost/youtubewebservice/shop-categorylist-product.php')
       .success(function(data) { 
           $scope.userslists = data;
        }) 
        .error(function(err) { 
          return err; 
        }); 
    $scope.save() = function(index) {
        $rootScope.index = index;
    }
}]);
app.controller('ProductController', ['$scope', function() {
}]);

产品页面

<div class="users-detail">
<h2 class="users-name"> {{ userslists[index].category.name }} </h2>
<h2 class="name"> {{ userslists[index].category.products.post_title }} </h2>
<h2 class="users-name"> {{ userslists[index].category.name }} </h2>
<h2 class="name"> {{ userslists[index].category.term_id }} </h2>
<h2 class="name"> {{  userslists[index].category.term_id }} </h2>
</div>