Question

大家好我已经有了这段代码：

<!DOCTYPE html>
<html ng-app="app">
    <head>
        <meta charset="utf-8">
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
        <script src="angular-route.min.js"></script>
    </head>

<body>
    <div class="container" ng-controller="myCtrl">          
        <div class="main">
            {{hello world}}
            <div ng-view></div>

        </div>

    </div>



<script>
    var app=angular.module('app',[]);

    app.config(function($routeProvider){
        $routerProvider.
        when('/',{templateUrl: 'partials/directory.html'})
        .when('/view/:id',{templateUrl:'partials/view.html',
                controller:viewController})
        .otherwise({redirecTo:'/'})
    });

    app.controller('myCtrl',['$scope','$http',function($scope,$http){
        $http.jsonp('http://www.filltext.com/?callback=JSON_CALLBACK&fname={firstName}&lname={lastName}&tel={phone}').success(function(data){
            $scope.people=data;
        });
    }]);

    app.controller('viewController',['$scope','$routeParams',function($scope,$routeParams){
            $scope.person=$scope.people[$routeParams.id];
    }]);
</script>
</body>
</html>

当我试图运行它时，由于controller注射，我猜它会出现$ injector错误。我希望我不会有另一个错字，但我确实检查了它。你可以帮我解决一下：）

Answer 1

您需要将ngRoute作为模块依赖项加载。点击此处：https://docs.angularjs.org/api/ngRoute/service/ $ routeParams

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

Answer 2

在html中，您需要将angular-route.js的脚本标记更正为：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-route.min.js"></script>

同样在javascript中你需要将ngRoute服务注入应用程序并更正路由，因为你需要将控制器更改为字符串并且.otherwise({redirectTo: '/'});上有拼写错误

var app=angular.module('app',["ngRoute"]);

app.config(function($routeProvider){
    $routerProvider.
    when('/',{templateUrl: 'partials/directory.html'})
    .when('/view/:id',{templateUrl:'partials/view.html',
            controller:'viewController'})
    .otherwise({redirectTo:'/'});
});

我希望这会有所帮助。

错误$ injector，ng-view

2 个答案: