gpt4 book ai didi

javascript - AngularJS 无法加载 ng-view inti index.html

转载 作者:太空宇宙 更新时间:2023-11-04 01:57:27 24 4
gpt4 key购买 nike

我正在尝试使用 AngularJS 设置一个单页应用程序。我将 Node 与 Express 一起使用,并且我有一个用作中间件的 apache 服务器(如果这很重要的话)。我的 index.html 页面加载良好,但 ng-view 内没有加载任何 View 。

这是我的代码

<!DOCTYPE html>
<html>
<head>
<link rel="icon" type="image/png" href="public/img/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="public/img/favicon-16x16.png" sizes="16x16">

<link rel="stylesheet" type="text/css" href="vendor/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="vendor/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<link rel="stylesheet" type="text/css" href="public/css/style.css">
<link rel="stylesheet" type="text/css" href="public/css/font-awesome-4.7.0/css/font-awesome.min.css">

<script type="text/javascript" src="vendor/angularjs/1.4.7/js/angular.min.js"></script>
<script type="text/javascript" src="vendor/angularjs/1.4.7/js/angular-base64.min.js"></script>
<script type="text/javascript" src="vendor/angularjs/1.4.7/js/angular-sanitize.js"></script>
<script type="text/javascript" src="vendor/lodash.js/4.16.4/js/lodash.min.js"></script>
<script type="text/javascript" src="vendor/jquery/1.11.3/js/jquery.min.js"></script>
<script type="text/javascript" src="vendor/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="node_modules/angular-route/angular-route.min.js"></script>

<script>
var myApp = angular.module('lispCDpoc', ['ngRoute']);

myApp.config(function($routeProvider, $locationProvider) {
console.log('oui');
$locationProvider.hashPrefix('');
$routeProvider.
when('/', {
templateUrl: 'pages/test.html',
controller: 'testController'
}).
otherwise({
redirectTo: '/'
});
});

myApp.controller('testController', function($scope) {
$scope.message = 'Message for my test page';
});
</script>

<meta charset="utf-8">
<title>LISP Monitoring POC</title>
</head>

<body>
<div>
<nav class="navbar navbar-default navbar-custom">
<div class="navbar-header">
<a class="navbar-brand" href="#"><img src="public/img/sg_logo_small.png" class="sg-logo"></a>
</div>
<ul class="nav navbar-nav">
<li class="active"><a href="#dashboard">Dashboard</a></li>
<li><a href="#releasenote">Release Note</a></li>
</ul>
<div>
<img class="logo-lisp" src="public/img/lisp2.png">
</div>
</nav>
<div ng-view></div>
</div>
</body>
</html>

我找不到我的index.html页面加载但没有插入test.html代码的原因

<div>
<h1>Test Page</h1>
<p>{{message}}</p>
</div>

最佳答案

不要忘记在主模板中声明您的应用模块。

  <body ng-app="lispCDpoc">
<div>
<nav class="navbar navbar-default navbar-custom">
<div class="navbar-header">
<a class="navbar-brand" href="#"><img src="public/img/sg_logo_small.png" class="sg-logo"></a>
</div>
<ul class="nav navbar-nav">
<li class="active"><a href="#dashboard">Dashboard</a></li>
<li><a href="#releasenote">Release Note</a></li>
</ul>
<div>
<img class="logo-lisp" src="public/img/lisp2.png">
</div>
</nav>
<div ng-view></div>
</div>
</body>

这是一个正在运行的 Plunkr:https://plnkr.co/edit/HlYxdCsLzfCNCY1dq7vp?p=preview

关于javascript - AngularJS 无法加载 ng-view inti index.html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47333066/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com