使用另一个控制器将参数从视图传递到另一个视图

时间:2015-08-20 18:55:49

标签: javascript angularjs asynchronous angularjs-resource

我试图调用REST API,将两个参数传递给另一个视图和另一个控制器。

语法为/api/:id/something/:id2/something

在接收端我有一个工厂,它将处理呼叫并将其传递给该新页面的控制器。

以下是我对该观点的看法:

<div>
    <table  class="table table-striped">
        <thead>
        <th style="padding-left: 20px;">ACN Name</th>
        <th>Product Name</th>
        <th>ContractNumber</th>
        <th>Start Date</th>
        <th>End Date</th>
        <th></th>
        <tr ng-repeat="row in acns">
            <td style="padding-left: 20px;"><a href="" ng-click="viewOrgList(ACNID)">{{row.ACNName}}</a></td>
            <td>{{row.ProductName}}</td>
            <td>{{row.ContractNumber}}</td>
            <td>{{row.ContractStartDate}}</td>
            <td>{{row.ContractEndDate}}</td>
            <td><a href="" ng-click="remove(row)"><i class="fa fa-times" style="font-size:1.5em;"></i></a></td>
        </tr>
    </table>
</div>

此视图的控制器如下所示:

app.controller('acnController', ['$scope','$location', '$routeParams', 
 function ($scope, $location, $routeParams) {

    //Passing acnId to networkOrg template to display.
    $scope.viewOrgList = function (acnId) {
        $location.path('/NetworkOrgs' + acnId);
    }

}]);

在/ NetworkOrgs模板的控制器上,它看起来像这样:

app.controller('orgController', ['$scope', '$routeParams','$location', 'orgFactory', function ($scope, $routeParams, $locatoin, orgFactory) {
    //Capture routeParam id and display associated orgs
    $scope.org = $routeParams.acnId;
}]);



app.factory('orgFactory', ['$resource','$routeParams', function ($resource, $routeParams) {
    return $resource("http://localhost:16047/api/acn/:acnId/networkOrgs", { acnId: $routeParams.acnId }, {
        getOrgs: { method: 'GET', params: { acnId: '@acnId'} }
    })
}])

这对我不起作用,而且我得到了一个&#34; Bad Argument&#34;结果

任何帮助都会很棒!

2 个答案:

答案 0 :(得分:1)

我敢打赌你在视图中错误地传递了参数。

ng-click="viewOrgList(ACNID)"

应该

ng-click="viewOrgList(row.ACNID)"

答案 1 :(得分:0)

您应该使用ng-click="viewOrgList(row.ACNID)"代替ng-click="viewOrgList(ACNID)"

并且应该

$scope.viewOrgList = function (acnId) {
    $location.path('/NetworkOrgs/:' + acnId);
}

而不是

$scope.viewOrgList = function (acnId) {
    $location.path('/NetworkOrgs' + acnId);
}

以这种方式尝试

路线:

$routeProvider.when('/NetworkOrgs/:acnId', { 
      templateUrl: 'Pages/acn/partials/network_orgs.html', 
      controller: 'orgController' 
 }); 
控制器中的

app.controller('orgController', ['$scope', '$routeParams','$location', 'orgFactory', function ($scope, $routeParams, $locatoin, orgFactory) {
    //Capture routeParam id and display associated orgs
    $scope.acnId= $routeParams.acnId; // ensure that you have acnId
     orgFactory.getOrgs($scope.acnId)
      .$promise.then(function(response) {
         console.log(response);// check response by console
       });
}]);
orgFactory中的

app.factory('orgFactory', ['$resource', function ($resource) {
    return {
            getOrgs: function(acnId) {
                var getOrgsById = $resource('http://localhost:16047/api/acn/:acnId/networkOrgs', {acnId: '@acnId'}, {
                        'get': {method: 'GET'} // if you expect return array from server then use 'get': {method: 'GET', isArray: true}
                    });
                 return getOrgsById .get({acnId: acnId});
            };
}]);