Angularjs ng-view not showing data

我正在通過Tuts +帶有AngularJS教程的更簡單的JavaScript應用程序學習Angularjs。現在我正在使用ng-view討論Routing Primer。我試圖在索引頁的ng-view中顯示列表頁面內容。出於某種原因，當我加載index.html時沒有顯示任何內容。我從搜索中發現，從angular 1.2.0開始，ngRoute已經被移植到它自己的模塊中。我必須單獨加載它並聲明依賴關係。但是我仍然無法顯示我的列表頁面上的任何內容。Angularjs ng-view not showing data

的index.html

<!doctype html> 
<html ng-app="myApp"> 
    <head> 
    <title>Angular App</title> 
    <script src="js/angular.min.js"></script> 
    <script src="js/angular-route.min.js"></script> 
    <script src="app.js"></script> 
    </head> 
    <body> 
    <div ng-controller="Ctrl"> 
     <div ng-view></div> 
    </div> 
    </body> 
</html>

list.html

<h3>List</h3> 
<ul> 
    <li ng-repeat="contact in contacts"> 
     <a href="#">{{contact.name}}</a>: {{contact.number}} 
    </li> 
</ul>

app.js

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

    app.config(function($routeProvider) { 
     $routeProvider.when('/', { 
      templateUrl: 'list.html', 
      controller: 'Ctrl' 
     }); 
    }); 

    app.controller('Ctrl', function($scope){ 
     $scope.contacts = [ 
      { name: 'Shuvro', number: '1234' }, 
      { name: 'Ashif', number: '4321' }, 
      { name: 'Anik', number: '2314' } 
     ]; 
    });

來源

2014-06-22 Shuvro

取出ng-controller從DIV這樣的：

<body> 
<div > 
    <div ng-view></div> 
</div> 
</body>

作廢「小姐定路徑」添加otherwise的主要配置，如：otherwise({ redirectTo: '/'});

app.config(function($routeProvider) { 
     $routeProvider.when('/', { 
      templateUrl: 'list.html', 
      controller: 'Ctrl' 
     }).otherwise({ redirectTo: '/'}); 
});

Online Demo

來源

2014-06-22 13:51:15 Dalorzo

我刪除了NG-控制器和添加否則routeprovider如你所說，但仍沒有顯示。 – Shuvro

在我的瀏覽器中顯示的網址是'file：/// C：/Users/Shuvro/Desktop/AngularApp/index.html#/'。如果這有助於找到我想念的東西。 – Shuvro

@Shuvro它在我的結束[**在線演示**]（http://plnkr.co/edit/QVH9ZadvJvurHhQdqVyS?p=preview） – Dalorzo

Angularjs ng-view not showing data

回答

相關問題