通过服务Angular向服务器发送$routeParam


Sending a $routeParam to the server through a service Angular

你必须忍受我,因为我是自学成才的。我的服务器上有一个php页面,它需要一个$_get变量来对服务器端而不是客户端的数据进行排序。我在Angular中使用routeParams来发送变量。这是有效的,但是它只在刷新网页时才有效。我的头撞到墙上很疼,请有人帮帮我。

控制器:

    app.controller('JuiceController', ['$scope', 'juices', function($scope, juices) {
        juices.success(function(data){
        $scope.juices = data;
        });
    }]);

服务:

    app.factory('juices', ['$http', '$routeParams',function($http, $routeParams) {
return $http.get('http://madcow-app.dev/application/backend/api/products.php', {
    params: {prod: $routeParams.prod}
    })
     .success(function(data) {
       return data;
    })
     .error(function(err){
        return err;
    });
   }]);

Html输出(果汁视图):

    <div class="juice-wrap" ng-repeat="juice in juices">
<div class="juice-img"><img ng-src="{{ juice.imgpath }}" width="163" height="176" alt=""/></div>
<div class="juice-rght">
  <div class="juice-title">{{ juice.name }}</div>
  <div class="juice-desc">{{ juice.descrip }}</div>

路线提供商

    $routeProvider
.when('/', {
templateUrl: 'script/views/home.html'
})
.when('/categories/', {
controller: 'CatController',
templateUrl: 'script/views/categories.html'
})
.when('/juice/:prod', {
controller: 'JuiceController',
templateUrl: 'script/views/juice.html'
})
.when('/events/', {
controller: 'EventController',
templateUrl: 'script/views/events.html'
})
.when('/qr/', {
templateUrl: 'script/views/qr.html'
})
.when('/feedback/', {
templateUrl: 'script/views/feedback.html'
})
.otherwise({
redirectTo: '/'

php函数输出json(输出到下面的php控制器,并将类别id作为变量:)

    return json_encode($results);

到php控制器(这是angular服务/工厂从中提取产品json数组的页面:

    <?php
    include "../../init.php";
    if (isset($_GET['prod']))
    {
    echo $MC->Api->getProductsApi($_GET['prod']);
    }
    else
    {
    echo 'error';
    }

这是类别html:

    <div class="cat-btn" ng-repeat="cat in cats">
<a href="#/juice/{{cat.catid}}">
  <img ng-src="{{ cat.imgpath }}" width="363" height="195" alt=""/>
  <div class="cat-btn-text"> {{ cat.name }} </div>
</a>

基本上,我想要实现的是,当用户在前端单击一个类别时,使用类别id作为php函数的过滤器,以角度路由到产品视图,从而只使用该类别中的果汁填充json输出。

我不确定我是否应该这样做,或者我是否需要从另一个角度击球。请记住,我是一个完整的javascript noob和外行将是伟大的答案。

提前谢谢。。。。。

工厂:

app.factory('juices', [
    '$http', '$routeParams', function ($http, $routeParams) {
        var self = this;
        function getJuices() {
            $http.get('http://madcow-app.dev/application/backend/api/products.php', {
                params: {prod: $routeParams.prod}
                })
                .success(function (data) {
                    self.juices = data.data;
                })
                .error(function (err) {
                });
        }
        return {
            getJuices: getJuices,
           juices: self.juices
        }
    }
]);

控制器:

app.controller('JuiceController', [
    '$scope', 'juices', function ($scope, juices) {
        juices.getJuices();
        $scope.$watch(function () {
            return juices.juices
        }, function (newJuices, oldJuices) {
            // This is triggered when juices.juices changes
            // newJuices containes the juices retrieved from server
            // This is needed because it is asynchronous
        });
    }
]);