chargement du modèle jade à travers angulaire
Je suis en train de travailler sur une seule page web app, et j'ai voulu charger en jade vues avec mon angulaire modèle, mais j'ai du mal à envelopper ma tête exactement comment le faire.
Voici mon angulaire du modèle:
index.html
<!doctype html>
<html ng-app="test">
<head>
<title>My Angular App</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<script type="text/javascript" src="/javascripts/app2.js"></script>
</head>
<body>
<p> Hello </p>
<div>
<div ng-view></div>
</div>
</body>
</html>
J'ai fait un contrôleur pour mon angulaire du modèle: navigation.js
angular.module('test', [])
.config(viewRouter);
function viewRouter ($routeProvider){
$routeProvider
.when('/', {templateURL: 'views/index.jade'});
}
Ici, je suis en train d'utiliser un modèle jade rendre sur la page, mais il ne semble pas fonctionner.
J'ai une vision de jade modèles,
index.jade
extends layout
block content
h1= title
include partials/menu
.views-wrapper
include partials/login
mise en page.jade:
doctype
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
script(src='//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js')
script(src='/javascripts/navigation.js')
menu.jade:
ul
li.a VIEW A
li.b VIEW B
li.c VIEW C
li.l VIEW LOGIN2
J'ai aussi une vue simple des modèles (nommé.jade, b.jade, et c.jade) qui ont juste des en-têtes simples de l'affichage d'un nom comme un test pour voir si les travaux de routage. J'ai du mal à obtenir ces modèles pour se connecter, je n'arrive pas à envelopper ma tête autour de, ni de trouver une réponse à comment je peux afficher ma jade vues par le biais de mon angulaire du modèle. Avant je n'étais pas angulaire à l'aide d'un modèle, mais a décidé de l'utiliser pour traiter avec l'URL plus facilement.
c'est mon app.js sur mon côté serveur:
/**
* Module dependencies.
*/
var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');
var app = express();
//all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.json());
app.use(express.urlencoded());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.cookieParser('cookies monster')); //Cookie secret
//development only
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}
app.set('public', path.join(__dirname, 'public'));
/*
* Views
*/
//app.get('/', routes.index);
app.get('/', function(req, res, next){
return res.sendfile(app.get('public') + '/index.html');
});
app.get('/users', user.list);
app.get('/a', routes.a);
app.get('/b', routes.b);
app.get('/c', routes.c);
app.get('/login2', routes.login2);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
et c'est un des itinéraires de contrôleur que j'ai dû rendre le point de vue avant que j'ai décidé d'utiliser angulaire
index.js:
exports.index = function(req, res){
res.render('index', { title: 'New Test' });
};
//View A
exports.a = function(req, res) {
res.render('partials/a', { layout: false, test: 'a' });
};
//View B
exports.b = function(req, res) {
res.render('partials/b', { layout: false, test: 'b' });
};
exports.c = function(req, res) {
res.render('partials/c', { layout: false, test: 'c' });
};
exports.login2 = function(req, res) {
res.render('partials/login2', { layout: false, test: 'login2' });
};
Je sais que c'est beaucoup de code à regarder, mais je serais vraiment reconnaissant de toute aide.
OriginalL'auteur | 2014-01-13
Vous devez vous connecter pour publier un commentaire.
Vérifier mon réponse sur stackoverflow sur l'utilisation d'AngularJS semences pour travailler avec Jade, elle peut vous aider avec votre question.
OriginalL'auteur Alex Choroshin