Angularjs ng-viewが応答しません

私はangularjsで遊んでいます。なぜng-viewが動作しないのかわかりません。私は何を間違っているのですか？Angularjs ng-viewが応答しません

var app = angular.module('Demo', ['ngRoute']) 
 
.config(function ($routeProvider) { 
 
    $routeProvider.when('#/about', { 
 
     templateUrl: 'about.html', 
 
     controller: 'homeController' 
 
    }); 
 
    $routeProvider.when('#/contacts', { 
 
     template: 'contacts.html', 
 
     controller: 'contactsController' 
 
    }); 
 
}); 
 
app.controller('homeController', function ($scope) { 
 
    alert('homeController'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src=""//ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-route.js""></script> 
 
<body ng-app> 
 
<div class="menu"> 
 
    <ul> 
 
     <li><a href="#/about">About</a></li> 
 
     <li><a href="#/contacts">Contacts</a></li> 
 
    </ul> 
 
</div> 
 

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

 
<template id="about.html"> 
 
    about 
 
</template> 
 

 
<template id="contacts.html"> 
 
    contacts 
 
</template> 
 
    </body>

出典

2016-05-25 A191919

ここにいくつかの問題がありました：

は角度のルートのためのあなたのスクリプトのソースはHTML部分で間違っていました。
あなたの$ routeProvider.when行に '＃'は必要ないので、削除しました。
テンプレートの1つにtemplateUrlが使用されていますが、これは正しくありません。それはテンプレートでなければなりません：あなたはURLを呼んでいないので。ここで

作業plunkerです： https://plnkr.co/edit/GSoJ4sAxM8joH6zmrxjf?p=preview

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

// URLs should not have # in them 
.config(function ($routeProvider) { 
    $routeProvider.when('/about', { 
     template: 'about.html', 
     controller: 'homeController' 
    }); 
    $routeProvider.when('/contacts', { 
     template: 'contacts.html', 
     controller: 'contactsController' 
    }); 
}); 

app.controller('homeController', function ($scope) { 
    alert('homeController'); 
}); 

app.controller('contactsController', function ($scope) { 
    alert('contactsController'); 
});

出典

2016-05-25 22:04:40 Brian

Angularjs ng-viewが応答しません

答えて

関連する問題