Question

我有一个非常简单的程序，我正在尝试使用下拉菜单加载页面。但由于某种原因，$ location.path无效。

这是我的代码。 HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>AngularJS Routing example</title>
  </head>

  <body ng-app="sampleApp">

    <div>
        <div>
        <div ng-controller="RouteController">
            <select ng-model="opt.selector" ng-options="opt as opt.label for opt in options">

            </select>
            <button ng-click="selectFn()">Go</button>

        </div>
        <div>
            <div ng-view></div>
        </div>
        </div>
    </div>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script src="app.js"></script>
  </body>
</html>

JS

var sampleApp = angular.module('sampleApp', []);

sampleApp .config(['$routeProvider','$locationProvider',
  function($routeProvider) {
    $routeProvider.
      when('/one', {
        templateUrl: '1.html',
        //controller: 'AddOrderController'
      }).
      when('/two', {
        templateUrl: '2.html',
        //controller: 'ShowOrdersController'
      }).
      otherwise({
        redirectTo: '/index.html'
      });
  }]);

    sampleApp.controller('RouteController', function($scope){

        $scope.options=[
            {label: '1', url:'#one'},
            {label: '2', url:'#two'}  

        ];
        $scope.selectFn = function($locationProvider){

            $location.path($scope.opt.selector.url));

        }

    });

有人能告诉我哪里出错了吗？我收到以下错误：

ReferenceError: $location is not defined
    at Object.$scope.selectFn

Answer 1

您需要将$location注入控制器，以便可以在控制器内部使用单例。你是（我想尝试将它注入你的控制器中的一个函数？），这不会像你现在使用它那样工作。如果你想按照现在的方式做到这一点：

    sampleApp.controller('RouteController',  function($scope, $location){

        $scope.options=[
            {label: '1', url:'#one'},
            {label: '2', url:'#two'}  

        ];
        $scope.selectFn = function(){

            $location.path($scope.opt.selector.url));

        }

    });

虽然我强烈建议您使用$window服务重定向

$ location.path未按预期重定向文档

1 个答案: