Angular JS UI示例应用程序无法运行

Question

我尝试了UI路由器示例应用程序（plnkr.co/edit/u18KQc?p=preview），但是当我在浏览器中运行相同的代码时，它无法正常工作。最近API的任何变化？直到＆＃34; $ urlRouterProvider.otherwise（＆＃34; / ROUTE1＆＃34）＆＃34;它正在工作，因为它被路由到＆＃34; / route1＆＃34;最初

index.html的附加文件（在同一目录中）：

• route1.html
• route1.list.html
• route2.html

• route2.list.html

  var myapp = angular.module('myapp', ["ui.router"])
  myapp.config(function($stateProvider, $urlRouterProvider){
    // For any unmatched url, send to /route1
    $urlRouterProvider.otherwise("/route1")
  
    $stateProvider
      .state('route1', {
          url: "/route1",
          templateUrl: "route1.html"
      })
        .state('route1.list', {
            url: "/list",
            templateUrl: "route1.list.html",
            controller: function($scope){
              $scope.items = ["A", "List", "Of", "Items"];
            }
        })
  
      .state('route2', {
          url: "/route2",
          templateUrl: "route2.html"
      })
        .state('route2.list', {
            url: "/list",
            templateUrl: "route2.list.html",
            controller: function($scope){
              $scope.things = ["A", "Set", "Of", "Things"];
            }
        })
  })
  

Answer 1

AngularJS通过ajax调用加载模板，这样的调用只能由浏览器从服务器运行页面时进行，从文件系统加载应用程序（地址栏中的file:///）将无效。

您可以使用简单的服务器，例如python -m http.server