AngularJS:如何通过ng-href将多个参数传递给控制器​​? [英] AngularJS : How to pass multiple parameters to controller through ng-href?

问题描述

我有一个包含编辑按钮的表，用于更新记录.当我将单个id传递给ng-href时，它可以正常工作并打开表单页面:

I've a table containing edit button to update the record. When I'm passing single id to ng-href its working fine and opening form page:

例如:在我的index.html表中

<a class="btn btn-warning" ng-href="#/provider/{{row._id}}">Edit</a>

但是我想将另一个参数连同row._id一起传递给ng-href，如:

But I want to pass one more parameter along with row._id to ng-href like:

<a class="btn btn-warning" ng-href="#/provider/{{row._id}}/collectionName/{{collectionName}}">Edit</a>

它不起作用，并重定向到主页.

Its not working and redirecting to home page.

这是我的控制器:

    $timeout(function () {
        if ($routeParams.id !== undefined) {                
            $http.get('/providerlist/'+$routeParams.id, {
                params:{
                    id:$routeParams.id, 
                    collectionName:$routeParams.collectionName
                }
            }).success(function (response) {
                alert(response);
                $scope.providerList = response;
                $scope.id = response['_id'];
            });
        }
    });

app.js用于路由:

var ProviderApp = angular.module('ProviderApp', ['ngRoute'])
.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
    .when('/home', {
        templateUrl: 'templates/home/index.html',
        controller: 'HomeController',
        controllerAs: 'home'
    })

    .when('/provider', {                            
        templateUrl: 'templates/provider/index.html',
        controller: 'ProviderController',
        controllerAs: 'provider'
    })                        
    .when('/provider/:id', {                            
        templateUrl: 'templates/provider/form.html',
        controller: 'ProviderController',
        controllerAs: 'provider'
    })                        
    .otherwise({
        redirectTo: '/home'
    });
}]);

在单击edit按钮后，我想做的就是将其重定向到form.html，且参数/数据为id和collectionName

Here what exactly I want to do is after clicking on edit button it should redirect to form.html with parameter/data of id and collectionName

任何帮助将不胜感激.

推荐答案

如果要在ng-href中使用多个参数，还应该在app.js中更新路由网址.

If you want to use multiple params in ng-href you should also update your route url in app.js.

当您在ng-href中使用了多个参数，但没有与此路由匹配的路由，然后工作了otherwise路由并重定向到home时.

when you used multiple parameters in ng-href but no route matching with this route then worked otherwise route that redirect to home.

您可以尝试.

在html中:

<a class="btn btn-warning" ng-href="#/provider/{{row._id}}/collectionName/{{collectionName}}">Edit</a>

在app.js中添加一条路线，例如

add a route in app.js like

.when('/provider/:id/collectionName/:cName', {                            
        templateUrl: 'templates/provider/form.html',
        controller: 'YourController'
    });

，并且控制器中的控件需要更改，例如:

and in controller need to change like:

 $http.get('/providerlist/'+$routeParams.id +'/collectionName/'+ $routeParams.cName)
 .success(function (response) {
     alert(response);
     $scope.providerList = response;
     $scope.id = response['_id'];
 });

因此服务器端路由应类似于:/providerlist/:id/collectionName/:cName

so server side route should be like: /providerlist/:id/collectionName/:cName

这篇关于AngularJS:如何通过ng-href将多个参数传递给控制器​​?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！