我正在使用M.E.A.N堆栈构建和应用程序。
我正在使用Angular Ui路由器进行路由,而且我似乎遇到了部分路由正确的问题。
使用以下方法成功调用主视图的链接:
.state("framework", {
url:"/genetic",
templateUrl: "/partials/framework/main.html",
css: "/stylesheets/genetic/global/main.css"
})
但是当我尝试使用相同的格式调用部分时,我面对的是 " 505内部服务器错误"。
.state(framework.buttons", {
url:"/framework/buttons",
templateUrl: "/partials/framework/buttons.html",
css: "/stylesheets/framework/global/main.css"
})
我尝试设置相对于(main.html)的路径,但收到错误: " 404 Not Found"。
.state("framework.buttons", {
url:"/framework/buttons",
templateUrl: "buttons.html",
css: "/stylesheets/framework/global/main.css"
})
申请结构:
+--public
+--routes
+--index.js
+--users.js
+--views
| +--partials
| | +--admin
| | +--framework
| | | +--app
| | | | +--footer.jade
| | | | +--navigation-list.jade
| | | | +--app.jade
| | | +--buttons
| | | | +--default
| | | | +--disabled
| | | | +--document-overview
| | | | +--fluid
| | | | +--group-default
| | | | +--group-vertical
| | | | +--icon
| | | | +--sizing
| | | | +--buttons.jade
| | | +--forms
| | | +--buttons.html
| | | +--main.html
| | +--tour
| | +--user
| +--error.jade
| +--index.jade
| +--index.html
| +--layout.jade
+--app.js
+--Gruntfile.js
+--package.json
app.js
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var routes = require('./routes/index');
var users = require('./routes/users');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('jade').renderFile);
app.set('view engine', 'jade');
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', routes);
app.use('/users', users);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handlers
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
module.exports = app;
Index.js
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index.html', { title: 'Home' });
});
router.get('/partials/:name', function(req, server) {
var name = req.params.name; server.render('partials/' + name);
});
router.get('/partials/framework/:name', function(req, server) {
var name = req.params.name; server.render('partials/genetic/' + name);
});
router.get('/partials/tour/:name', function(req, server) {
var name = req.params.name; server.render('partials/tour/' + name);
});
module.exports = router;
Angular Ui Routing
var app = angular.module('app', [
'ui.router',
'door3.css',
'appControllers'
]);
app.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise("/framework");
//
// Now set up the states
$stateProvider
.state("framework", {
url:"/framework",
templateUrl: "/partials/framework/main.html",
css: "/stylesheets/framework/global/main.css"
})
.state("framework.buttons", {
url: "/buttons",
templateUrl: "/partials/framework/buttons.html",
css: ["stylesheets/framework/buttons/main.css", "/stylesheets/genetic/global/main.css"]
})
}]);
玉:
include navigation-list
main
nav.group.bar
ul.breadcrumb.col.collapse.large-6-12
li
a(href="#") Getting Started
li
a(href="#") Buttons
div(ui-view class="appview" id='appview')
答案 0 :(得分:0)
根据你的应用程序结构,buttons.html是在按钮文件夹里面。
目前您的 templateUrl 是
templateUrl: "/partials/framework/buttons.html",
但根据您的应用程序结构,它应该是
templateUrl: "/partials/framework/buttons/buttons.html",
这应该可行,我想,让我知道我还没有找到 NOT 加载局部视图的任何其他原因。它不应该提供" 404 Not Found" 如果partial在framework文件夹中,而不是其中的任何子文件夹。