gpt4 book ai didi

javascript - AngularJS ui-router不加载模板

转载 作者:行者123 更新时间:2023-11-30 15:07:21 25 4
gpt4 key购买 nike

我的 AngularJS 应用找不到模板 landing.html ,尽管我试图在各处做出正确的声明。

index.html :

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
@@include('partials/head.html')
<body>

@@include('partials/header.html')

<main class="content">

<ui-view></ui-view>

</main>

@@include('partials/footer.html')
</body>
</html>

main.js :

angular.module('myApp', ['ui.router'])
.config(['$stateProvider', '$locationProvider',
function($stateProvider, $locationProvider) {
$stateProvider
.state('landing', {
url: '/',
controller: 'LandingCtrl as landing',
templateUrl: 'templates/landing.html'
})
.state('faq', {
url: '/faq',
templateURL: 'faq.html'
});
$locationProvider
.html5Mode({
enabled: true,
requireBase: false
});
}]);

我的文件结构如下:

/src
|
|--index.html
|--faq.html
|--js
| |--main.js
| |--controllers
| | |--LandingCtrl.js
|--templates
| |--landing.html

我认为路径为landing.html已正确声明,但我仍然收到以下错误:

angular.min.js:sourcemap:123 Error: [$compile:tpload] http://errors.angularjs.org/1.6.4/$compile/tpload?p0=templates%2Flanding.html&p1=404&p2=Not%20Found

有人知道为什么应用找不到模板吗?

编辑当我在浏览器 URL 中输入这个时: http://localhost:3000/templates/landing.html

结果是: Cannot GET /templates/landing.html

编辑 2删除 $locationProvider还删除了“未找到 landing.html”错误消息,但应该在 <ui-view> 内呈现的 View 仍然没有显示。

最佳答案

  • 在你的index.html更改 <ui-view></ui-view><div
    ui-view></div>
    .

在你的main.js更改代码如下:-

angular.module('myApp', [
'ui.router'
])
.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {

$stateProvider
.state('landing', {
url: '/landing',
controller: 'LandingCtrl as landing',
templateUrl: 'templates/landing.html'
});
$urlRouterProvider.otherwise('/landing');

}])
.run(['$http', '$templateCache', function($http, $templateCache) {

$http.get('templates/landing.html', {
cache: $templateCache
}).then(function(result) {
console.log(result);
});

}]);

关于javascript - AngularJS ui-router不加载模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45548234/

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