为什么我的ngRoute无法正常工作

时间:2017-02-08 20:56:14

标签: angularjs ngroute

我的ngroute适用于我的主页,但是当我点击链接转到我的教育页面时,它会运行。不然后运行.which(' / education ...并显示正确的templateUrl

home.html的

<div class="main">
  <div class="container">
    <div ng-view></div>

app.js

var app = angular.module('Danielle', ['ngRoute']);
app.config(function($routeProvider){

$routeProvider

.when('/',{
controller:'HomeController',
templateUrl:'views/homepage.html'
})      

.when('/education',{
  templateUrl:'views/education.html'
})

.otherwise({ 
  redirectTo: '/' 
}); 
});

homepage.html

<style>
body{
   background: url(/img/3kzlcl3rj8a-ricardo-gomez-angel.jpg) no-repeat center center fixed;
background-size: cover;
 }
</style>
<div class="jumbotron">
    <h1>Danielle Zurek</h1>
<a href="#/education.html">
<div class="education">
    <div class="row">
        <h2>Education</h2>
    </div>
</a>
   </div>
</div>

education.html

<style>
body{
   background: url(/img/grads.jpg) no-repeat center center;
   background-size: cover;
}
</style>

<div class="jumbotron">
  <h1>Education</h1>
</div>

2 个答案:

答案 0 :(得分:0)

您需要将视图名称添加到ng-view中 https://docs.angularjs.org/api/ngRoute/directive/ngView

答案 1 :(得分:0)

虽然您已经找到了问题,但已根据您的评论解决此问题。但是你应该考虑采取一些措施。当您使用MVC框架时,您应该始终考虑使用路由器更改应用程序路由。使用href="#/education"$window.location.href之类的内容实际上会刷新您的页面,这只是意味着它会重新启动您的应用程序。

您应始终保留href="javascript:void(0)",这将停止页面刷新。要更改路线,您应该在控制器中使用$location.path()