angularjs - 让templateUrl指向一个html文件

Question

在项目的 angularApp.js 中，我想使用 templateUrl 定义一个状态。首先，我尝试了以下方法:

app.config(['$stateProvider', function ($stateProvider) {
    $stateProvider
        .state('editor', {
            url: ...,
            templateUrl: '/editor.html',
            controller: ...
        })

控制台显示[Error] 无法加载资源:服务器在 http://localhost 处响应状态为 404(未找到)(editor.html，第 0 行) :3000/editor.html，这不是 editor.html 的位置。

然后，我尝试了相对路径

`templateUrl: '../../../../../Start/PRODSERVER/funfun/views/editor.html'`,

控制台在http://localhost:3000/Start/PRODSERVER/funfun/views/editor.html处显示相同的错误。但是，在浏览器中打开 http://localhost/Start/PRODSERVER/funfun/views/editor.html 确实会打开正确的文件。

有人知道如何解决这个问题吗？

PS:angularApp.js位于文件夹public/javascripts/中；主页 index.ejs 位于文件夹 views/ 中；我也将 editor.html 放入文件夹 views/ 中。 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 mongoose = require('mongoose');
var passport = require('passport');
require('./models/Posts');
require('./models/Comments');
require('./models/Users');
require('./config/passport');
mongoose.connect('mongodb://localhost/news');

var index = require('./routes/index');
var users = require('./routes/users');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// 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(passport.initialize());

app.use('/', index);
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 handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

Answer 1

您的 HTML 文件是静态文件，因此将从您使用 express.static 函数定义的静态文件夹中提供该文件。

app.use(express.static(path.join(__dirname, 'public')));

将模板 HTML 放置在公共(public)文件夹中，以便可以访问它们。