2017-01-10 7 views
0

Я работаю с маршрутом AngularJS для своего сайта, но NG-VIEW ничего не загружает. Я просто проверяю ссылку «about». Я хочу, чтобы NG-VIEW показывал about.html, когда я нажимаю «Обо мне» из панели навигации.AngularJS ng-view не загружается

Вот index.html:

<!DOCTYPE html> 
<html lang="en-US"> 
    <head> 
     <link href="/css/style.css" rel="stylesheet"> 

    <link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-route.min.js"></script> 

    <script src="/js/parallax.js-1.4.2/parallax.js"></script> 

    <title>##</title> 
</head> 

<body ng-app="AgendaApp"> 

    <div class="header"> 
     <div class="container"> 
      <ul id="topnav"> 
       <li><a href="/">Home</a></li> 
       <li><a href="#/about">About Me</a></li> 
       <li><a href="#">GitHub</a></li> 
       <li><a href="#">Resume</a></li> 
       <li><a href="#">Facebook</a></li> 
      </ul> 
     </div> 
    </div> 

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



</body> 

<script src="js/app.js"></script> 
<script src="js/controllers/AgendaController.js"></script> 
<script src="js/controllers/ScheduleController.js"></script> 
<script src="js/services/schedules.js"></script> 

app.js и является:

var app= angular.module("AgendaApp", ['ngRoute']); 

app.config(function($routeProvider) { 
    $routeProvider 
    .when('/', { 
     controller: 'MainController', 
     templateUrl: 'views/main.html' 
    }) 
    .when('/about', { 
     controller: 'AgendaController', 
     templateUrl: 'views/about.html' 
    }) 
    .when('/detail', { 
     controller: 'ScheduleController', 
     templateUrl: 'views/schedule.html' 
    }) 
    .otherwise({ 
     redirectTo: '/' 
    }); 
}); 

и контроллер:

app.controller("AgendaController", ['$scope', 'schedules', function($scope, schedules) { 
    schedules.success(function(data){ 
     $scope.schedules = data; 
    }); 
}]); 

мой Controlle r ничего не делает.

ответ

0

Попробуйте это,

<div class="container"> 
    <div class="row"> 
    <div class="col-sm-12"> 
     <div class="nav"> 
     <a href="#home" class="button">Home</a> 
     <a href="#about" class="button">About</a> 
     <a href="#detail" class="button">Detail</a> 
     </div> 
    </div> 
    </div> 
</div> 

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

DEMO

+0

спасибо! Отлично работает сейчас –