javascript - 我无法在 AngularJS 的下一页上获取下拉列表的选定项目

Question

这是我的 app.js

var countryApp = angular.module('countryApp', ['ngRoute']);
countryApp.controller('testController', ['$scope', '$http', '$location', function ($scope, $http, $location) {
  $http({
    url: 'countries.json',
    method: "GET",
    headers: {'Content-Type': 'application/json'}
  }).success(function (data) {
    $scope.details = data;
    console.log("data---------->", $scope.details);
  }).error(function (data) {
    console.log("data error---------->", $scope.details);
  })
}]);

countryApp.config(['$routeProvider', function ($routeProvider) {
  //$httpProvider.interceptors.push('httpErrorInterceptor');
  $routeProvider.when('/countrydetails', {
    templateUrl: 'partials/country-detail.html',
    //controller: 'testController',
  }).otherwise({
    redirectTo: '/countrylist',
    templateUrl: 'partials/country-list.html',
    controller: 'testController',
    });
}])

countryApp.factory('testService', ['$scope', '$http', function ($scope, $http) {
  return { }
}])

这是我的国家列表.html

<h1>COUNTRIES</h1>
<select>
  <option ng-repeat="country in details | orderBy:'name'">
    <a>{{country.name}}</a>
  </option>
</select>
<a href="#/countrydetails"><button >click</button></a>

我需要在单击按钮时获取下一页上的国家/地区名称。为此，我有一个名为 Country-details.html 的 html 页面我可以做什么来获取此 html 页面中的国家/地区名称。

Answer 1

像这样设置你的路线

$routeProvider.when('/countrydetails/:name', {
templateUrl: 'partials/country-detail.html',
});

更改您的 html 格式。

 <a ng-href="#/countrydetails/{{country.name}}">
<button >click</button></a>

最好实现点击 Controller 功能以使用正确的路线，但这正是您实际需要的。