Angularjs pasa el parámetro a una página desde ng-click

He seguido tres botones en la parte superior de mi página con el cuadro de input debajo.

<div> <form> <div> Enter Show Name<input type="text" ng-model="showName" /> </div> </form> </div> <div> <button ng-click="href="/api/renameShow"">Rename Show</button> <button ng-click="href="/api/updateShow"">Update Show</button> <button ng-click="href="/api/checkShow"">Check Show</button> </div> 

Mi código de module con routes es

  var showApp = angular.module("showApp", ["ngRoute", "ngResource", "ui"]). config(function ($routeProvider, $locationProvider) { $routeProvider. when('/', { controller: '', templateUrl: 'main.html' }). when('/api/renameShow', { controller: 'renameShowCtrl', templateUrl: '/templates/renameShow.html' }). when('/api/updateShow', { controller: 'updateShowCtrl', templateUrl: '/templates/updateShow.html' }). when('/api/checkShow', { controller: 'checkShowCtrl', templateUrl: '/templates/checkShow.html' }); 

Básicamente, lo que bash hacer es que cuando se hace clic en uno de los botones, el ng-clic llama a la página corrosponding y pasa el parámetro "showName". Por favor, hágame saber cómo solucionarlo. Gracias

En primer lugar, debe indicarle a sus controlleres de destino (la página a la que se refiere) que debe esperar y aceptar un parámetro cuando naveguemos a esa página:

 $routeProvider.when('/api/renameShow/:showName?', { controller: 'renameShowCtrl', templateUrl: '/templates/renameShow.html' }) 

El signo de interrogación después del parámetro indica que es un parámetro opcional. Puede lograr lo mismo con las tags de anclaje:

<a href="#/view2/mike">Go to view 2</a>

Si insistes en usar botones, escribe una function personalizada que se enganche con el ng-clic del button, y luego pasa el parámetro que desees así desde tu controller actual:

 <button ng-click="customNavigate('Mike')">Rename Show</button> 

Y en el controller:

  $scope.customNavigate=function(msg){ $location.path("/view2"+msg) } 

y luego en el controller de destino:

 app.controller("renameShowCtrl",function($scope,$routeParams){ $scope.showName=$routeParams.showName }); 

Digamos que necesitamos psoid en sodtl.htm:

En HTML – so.html:

 <tr ng-controller="SoController" ng-repeat="x in sos"> <td>{{x.date}}</td> <td><a href="#/sodtl/{{x.soid}}">Dtl</a></td> </tr> 

En AngularJs – app.js – Config:

  app.config(function ($routeProvider) { $routeProvider. when ('/sodtl/:psoid?', { templateUrl : 'pages/sodtl.html', controller : 'SoDtlController' } ) }); 

En Controller – app.js:

 app.controller('SoDtlController', function ($scope, $http, $location, $routeParams) { $scope.message = " $routeParams.psoid = " + $routeParams.psoid; }); 

Por lo tanto, puede usar psoid para mostrar datos en la página sodtl.html.