如何修复将 angularjs 代码与 html 代码分离导致的错误？答案

【问题标题】：How to fix error caused by separating the angularjs code from the html code?如何修复将 angularjs 代码与 html 代码分离导致的错误？
【发布时间】：2019-12-15 18:11:08
【问题描述】：

我正在我的 Angular 应用程序中设置 app.js 文件，但我在控制台中收到 n 错误。我将所有文件都按照推荐和包含的顺序排列在一起。我该如何解决这个错误“

错误：“[$compile:tpload] http://errors.angularjs.org/1.6.9/$compile/tpload?p0=main.html&p1=404&p2=Not%20Found”？

下面是我正在使用的代码。

<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap  /4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="content/css/main.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
<script src="app.js"></script>
</head>

<body class="main_bg" ng-app="Travelapp">
    <div class="container">
    </div> 
    <div ng-view></div>
    </div>
</body>

</html>

var app = angular.module('Travelapp', ["ngRoute"]);
app.config(function($routeProvider){
    $routeProvider
    .when("/",{
      templateUrl: "main.html",
      controller: "mainController"
    })
    .otherwise({
      template: "<h1>Request error</h1><br/><p>Error in your request, Could not be handled</p>"
    });
});

app.controller("mainController", function($scope){    
});

【问题讨论】：

main.html 存在吗？
您是否将您的main.html 文件和您的angular module (Travelapp) 文件放在了（放置）同一个文件夹中？
@MaksymPetrenko 感谢因缺少 main.html 而导致的答案
添加为答案

标签： html angularjs ngroute

【解决方案1】：

错误表明您的 main.html“未找到”。原因可能是这个文件不存在

【讨论】：