Question

我正在尝试使用angular js实现路由功能。不幸的是，路由功能根本不起作用。我尝试了很多选项并重新检查了代码的语法错误等但没有运气..

这是我的代码。

HTML代码：

<!doctype html>
<html>
   <head>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular-resource.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular-route.min.js"></script>


     <link href="index.css" rel="stylesheet"/>
     <script src="index.js"></script>
   </head>
   <body ng-app="App">
   <div ng-controller="AppController as ctrl">
   <header>
   <h1> Restaurants Explore</h1>
   <h4> Way to explore the menus</h4>
   </header>

    <nav>
    <ul>
    <li ng-repeat="entry in arrayOfObjects"><a href="#" ng-click="ctrl.displayRestaurant($index)">{{entry.name}}</a></li>
    </ul>
   </nav>
   <section ng-model="restaurant">

   <div>
   <table>
    <tr><td><a href="#menu">Menu Details</a></td></tr>
   </table>
   </div>
   <div ng-view>
   asdfslajfdsjfdl
   </div>
   </section>
   </div>
   </body>

index.js

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


module.factory("mywebservice",function($resource){

        return $resource("http://localhost:8080/MyWebService/myweb/msgservice");
}); 

module.controller("menuController", function($scope,$routeParams){

    alert();
    /*$scope.arrayOfObjects = mywebservice.get({restId:$routeParams.restId}).$promise.then(
        function(response){
            alert(JSON.stringify(response));
            },
        function(error){
            alert(error.message);
        }   
    );*/

});


module.config(['$routeProvider',function($routeProvider){

        alert("Inside router provider");
        $routeProvider.
        when('/menu',{
            templateUrl:"templates/menu.html",
            controller:'menuController'
        })
        .otherwise({
            redirectTo:'/'
        });
    }
    ]);

module.controller("AppController", function($scope,mywebservice){

    $scope.arrayOfObjects = mywebservice.query().$promise.then(
        function(response){
            $scope.arrayOfObjects = response;
            },
        function(error){
            alert(error.message);
        }   
    );

    this.displayRestaurant=function(index){
        $scope.restaurant = $scope.arrayOfObjects[index];
    }

});

没有任何作用..任何线索......我从tomcat webservice运行这些应用程序。该应用程序正在尝试从REST Web服务中获取某些数据并将其显示在浏览器中。

angularjs routeProvider根本不工作/根本不调用控制器

0 个答案: