- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库?
- java - OnItemClickListener 不起作用,但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
我是 Angular 的新手,所以如果这真的很明显,我很抱歉!我正在制作一个 super 基本的应用程序,现在我想要的只是当用户直接进入一个页面时,它应该始终显示布局和内容。我正在使用 Angular 的 ng-route
。
截至目前,如果我转到 localhost:8080/,它会显示布局 (index.html) 和内容 (view/home.html)。如果我点击“关于”链接,它会转到 localhost:8080/about 并显示布局 (index.html) 和正确的内容 (view/about.html)。现在,如果我在地址栏中键入 localhost:8080/about,按回车键,我会从服务器日志中收到 404 错误。我不确定我错过了什么。任何意见表示赞赏!
应用程序.js
angular
.module('TestProject', ['ngRoute']);
路由.js
angular.module('TestProject')
.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl : 'views/home.html'
})
.when('/about', {
templateUrl: 'views/about.html'
})
.when('/contact', {
templateUrl: 'views/contact.html'
})
.otherwise({
redirectTo: "/"
});
$locationProvider.html5Mode(true);
});
index.html
<!DOCTYPE html>
<html lang="en" ng-app="TestProject">
<head>
<meta charset="utf-8">
<title>Test!</title>
<base href="/">
<link rel="stylesheet" href="assets/styles/app.css">
</head>
<body>
<header><h1>Logo</h1></header>
<nav>
<ul class="main">
<li>
<div class="navBorder">
<a href="about">About</a>
</div>
</li>
<li>
<div class="navBorder">
<a href="contact">Contact</a>
</div>
</li>
</ul>
</nav>
<div ng-view></div>
<script src="../bower_components/angular/angular.js"></script>
<script src="../bower_components/angular-route/angular-route.js"></script>
<script src="app.js"></script>
<script src="routes.js"></script>
</body>
</html>
我知道我还没有任何 Controller ,我刚刚开始这个项目,但目前还没有任何 Controller 。
以下是我的文件的组织方式:
我的文件结构如下:
/index.html
/app.js
/routes.js
/views/home.html
/views/about.html
/views/contact.html
最佳答案
如果使用 AngularJS 1.3+,你需要包含一个 <base href="" />
的概念.您可以在 <head>
中执行此操作标记为这样
<head>
<base href="/">
...
来自docs
Before Angular 1.3 we didn't have this hard requirement and it was easy to write apps that worked when deployed in the root context but were broken when moved to a sub-context because in the sub-context all absolute urls would resolve to the root context of the app. To prevent this, use relative URLs throughout your app:
另外,没有这个 <base />
标签,你可以声明.html5Mode()
因此...您需要采用这两种方法中的一种。
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
关于javascript - ngRoute- 直接 url 不显示模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30791810/
当我们写 angular.module('app',['ngRoute']); 这里的依赖到底是什么意思? 最佳答案 准确地说,ngRoute 只不过是一个简单的 Angular 模块,如 angul
我有一个非常奇怪的错误,我已经设置了路线和 Controller 。现在我只有一个没有错误的空白页面? index.html; Rekentalent.nl: Ben j
如果我尝试使用 ngRoute 方法更改主页面 View ,我有一个网络应用程序似乎根本无法工作。路由配置如下所示: var app; app = angular.module('genehaxx',
我想让这个简单的路由工作,但无法弄清楚问题出在哪里。 这是 HTML: . . .
我尝试通过导航栏使用 ngRoute 导航到其他 HTML 页面,但是当我单击导航栏上的不同按钮时,页面上没有显示任何内容。 Index.html 文件: table, th , td {
我正在创建一个 Angular 应用程序。文件结构如下: index.html login.html js/index.js index.html内容为
为什么我有这个错误?这是我的错误: “无法实例化模块 ngRoute” 详细信息: “ Uncaught Error :[$injector:modulerr] http://errors.angul
我的自定义指令中的隔离范围有问题。 我已经构建了一个自定义指令。当我没有使用父作用域在指令中设置作用域属性时,它起作用了。 它做了什么?它呈现了一个原生的 JavaScript 控件。每次加载站点时,
我在函数中传递 /?preview=true 并在 app.js $route.current.params.preview 中捕获。但是当我在控制台日志中输出 $route.current.para
我的代码遇到问题。 刷新 localhost:portnumber/home 或/todos 或/contacts 上的页面时崩溃 -> 使用重播无法获取/home 或/todos 或/contact
我的应用程序在几个小时前运行良好。现在,当我进入一个页面、触发一个事件时,应用程序会返回到主菜单。 我是这样使用 ngRoute 的: app.js angular.module('starter',
我是 Angular 新手,很难让 ngRoute 获取我的模板文件。 这是我的index.html:
我创建了一个网络应用程序,运行完美。现在我需要使用稍微不同的 Controller 创建几乎完全相同的 html 页面。我正在尝试使用 ngRoute 但它不起作用,我也不是 100% 相信我的路线会
我的 ng-route 与我在网页上实现的动画滚动冲突: 这是我的滚动元素: Next 其中“#one”是部分ID,其中滚动到goto-next是图像类,scrolly用于平滑滚动动画。 这是我的 n
我正在开发一个新的 Angularjs 网络应用程序,我必须在其中使用 ngRoute。首先我有点困惑,因为在我的情况下路由根本不起作用 - 我总是在 index 结束。和 MainCtrl。 在 i
我有四个文件: angularjs.js scripts.js ngroute.js index.html 现在,我配置了以下路由: var myApp = angular.module("myApp
我的应用程序可以与 ngRoute 配合使用,但是当我尝试直接访问我的部分(从地址栏)时,它仅返回该部分(没有主页)。如何隐藏这些部分以防止直接访问? 说明:我有一个有 2 个街区的站点。第一个是菜单
我有一个索引页面(登录),其中存在注册链接,因此在重定向时我尝试加载 Controller ,但它没有加载,控制台中也没有错误。 我的主页正在加载 URL:http://localhost:8081/
好吧,我是 Angular 的新手,为了测试我在 Codecademy 上获得的技能,我正在做一个音乐艺术家的测试网站。第一页是艺术家列表。当您单击其中一位艺术家的 block 时,它会在同一页面上加
是否可以向 AngularJS 应用程序中的所有路由添加基本 URL?本质上是改变它在服务器上的位置(有点,如果这有意义的话......所以它不会通过 / 而是通过 /something/ 访问)。
我是一名优秀的程序员,十分优秀!