Угловой способ для шаблонов

У меня возникли проблемы с тем, чтобы мои маршруты работали в моем приложении с угловыми углами. Он правильно отображает основной шаблон, но когда я нажимаю ссылку на другой шаблон, ничего не происходит. Вот мой код:Угловой способ для шаблонов

index.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>Node, NPM and Bower</title> 
    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"> 
    <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.css"> 
    <link rel="stylesheet" href="style.css"> 
</head> 
<body ng-app="app"> 

<nav> 
    <h3>Angular App</h3> 
    <a href="/">Home</a> 
    <a href="/about">About</a> 
</nav> 

<div ng-view></div> 

<script src="bower_components/angular/angular.js"></script> 
<script src="bower_components/angular-route/angular-route.js"></script> 
<script src="./app/app.js"></script> 
</body> 
</html>

APP.JS

angular.module("app", ["ngRoute"]). 
config(function($routeProvider) { 
    $routeProvider 
    .when("/", { 
     template : "<h1>Home</h1>" 
    }) 
    .when("/about", { 
     template : "<h1>About</h1>" 
    }); 
});

Кроме того, есть причина, по которой Bootstrap и угловые не работают вообще, когда я попробуйте использовать localhost с Express и Node? например, если я вытащил index.html в моем браузере, текст - sans-serif и т. д., но если я вытащил его с помощью localhost, это по-прежнему шрифт шрифта по умолчанию.

SERVER.JS

var express = require('express'); 
var app = express(); 
var path = require('path'); 

app.get('/', function(req, res) { 
    res.sendFile(path.join(__dirname + '/index.html')); 
}); 

app.listen(3000, function() { 
    console.log('app started'); 
});

источник

2017-02-21 Hudson Taylor

Угловая 1,5
Так с базовой 1,5 маршрутизации вы должны использовать:

<a href="#about">About</a>

Бить маршрут. См Plunker for more info

Угловая 1,6
Если вы используете угловую 1.6 это:

<a href="#!about">About</a>

Посмотрите на AngularJS: ngRoute Not Working другие варианты.

проблема Bootstrap
Там не должно быть никаких проблем, это правильно кэширование.

источник

2017-02-21 19:26:56

Спасибо за помощь! Это фиксированные вещи. Тем не менее, он по-прежнему не работает на localhost. Я добавлю файл server.js, чтобы вы могли посмотреть на это тоже. –

Ваш файл server.js выглядит хорошо для меня. Нет ли ошибок? Является ли угловой не загружен или это сервер, который не работает? –

Я понял. Мне пришлось добавить эти три строки: 'app.use (express.static (__ dirname + '/ views')); app.use ('/ bower_components', express.static (__ dirname + '/ bower_components')); app.use ('/ public', express.static (__ dirname + '/ public')); ' –

Я понял ответ. Вам необходимо сообщить серверу, чтобы он направил ваши статические файлы из своих каталогов следующим образом:

app.use(express.static(__dirname + '/views')); 
app.use('/bower_components', express.static(__dirname + '/bower_components')); 
app.use('/public', express.static(__dirname + '/public'));

источник

2017-02-21 20:45:21

ответ

Смежные вопросы