gpt4 book ai didi

javascript - Angular UI 路由器 View 不显示任何内容

转载 作者:行者123 更新时间:2023-11-27 23:35:15 24 4
gpt4 key购买 nike

我无法让 UI-Router 工作,这真的很烦人,因为我正在从我构建的另一个工作正常的网站上构建一个网站。目前, ui-view 不显示任何内容,并且 ui-sref 链接不可点击或重定向。我也没有收到任何错误。我的代码如下。任何帮助将不胜感激!

JS:app.js

var app = angular
.module("RssTransfers", ["ui.router"])
.config(MainRouter);

function MainRouter($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');

$stateProvider
.state('transfers', {
url: '/',
templateUrl: 'transfers.html',
})

.state('about', {
url: '/about',
templateUrl: 'about.html'
})

.state('upload', {
url: '/upload',
templateUrl: 'upload.html'
})
};

HTML:index.html

<!DOCTYPE html>
<html lang="en">
<head>
<title>RSS Transfers</title>

<link rel="stylesheet" type="text/css" href="./css/materialize.css" />
<link rel="stylesheet" type="text/css" href="./css/style.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script>
<script src="./js/ng-file-upload-shim.min.js"></script> <!-- for no html5 browsers support -->
<script src="./js/ng-file-upload.min.js"></script>
<script src="./js/app.js"></script>
<script src="./js/transferController.js"></script>
<script src="./js/uploadController.js"></script>
<script src="./js/materialize.js"></script>
</head>
<body ng-app="RssTransfers">

<div ng-include="'navbar.html'"></div>

<div class="wrapper" ui-view></div>


</body>
</html>

要显示的虚拟文本:transfers.html

<div ng-controller="TransferController as transfer">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Commodi, est, cum. Dicta, eius obcaecati quia culpa ipsam quibusdam tempore adipisci molestias optio, nam corporis, veritatis voluptatem incidunt cumque a sequi?</p>
</div>

根据要求,这是 Controller 的代码:

TransferController.js

angular.module('RssTransfers')
.controller('TransferController', TransfersController);

TransfersController.$inject = ['$http'];

function TransfersController($http){
var self = this;
self.all = [];
self.addTransfer = addTransfer;
self.newTransfer = {};
self.getTransfer = getTransfer;

getTransfers();
function getTransfers(){
$http
.get('http://localhost:3000/transfers/')
.then(function(response){
self.all = response.data.transfers;
});
}

function addCriminal() {
$http
.post('http://localhost:3000/transfer', self.newTransfer)
.then(function(response){
getTransfers();
});
self.newTransfer = {};
}

}

最佳答案

解决了,虽然我不知道为什么。我删除了前端文件并从头开始,效果很好。我怀疑 ui-router 和 ng-file-upload 可能存在冲突问题,但我到达那里后会解决该问题。

关于javascript - Angular UI 路由器 View 不显示任何内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34180109/

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