2016-05-21 6 views
0

今日は角で再生を開始しました。それで問題は全くありません。何度も似たような質問がありましたが、何も助けにならないので、私自身の質問で試してみることにしました。AngularJSルーティングビューはロードされていません

私の問題はルーティングにあります。私は2つのビュー(または部分)を持っています。自分のページを参照すると、最初のビュー(デフォルト)がうまく読み込まれます。私の2番目のビューを開く必要があるリンクをクリックするとURLは変わりますが、何も起こりません。ブラウザのリフレッシュボタンを押すと、ビューがロードされます。

<!DOCTYPE html> 
<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
    <script src="js/angular_route.js"></script> 
    <script src="js/angular_animate.js"></script> 
    <script src="js/angular_cookies.js"></script> 
    <script src="js/app.js"></script> 
    </head> 
<body style="padding:10px;" ng-app="rispa"> 
    <div ng-view></div> 
</body> 
</html> 

app.js

var rispa = angular.module("rispa", ['ngRoute', 'ngAnimate']); 
rispa.config(function ($routeProvider) { 
    $routeProvider 
     .when('/welcome', 
      { 
       controller: 'rispaController', 
       templateUrl: 'partials/welcome.html' 
      }) 
     .when('/accounts', 
      { 
       controller: 'rispaController', 
       templateUrl: 'partials/accounts.html' 
      }) 
     .otherwise({ redirectTo: '/welcome' }) 
}); 
rispa.controller('rispaController', function($scope) { 
    $scope.title = "Home Page"; 
}); 

歓迎ビュー(デフォルト)

<div class="container"> 
    <h1>Welcome!!!</h1> 
    <a href="#/accounts">get accounts</a> 
</div> 

アカウント

インデックスページは

<div class="container"> 
    <h1>accounts</h1> 
    <a href="#/welcome">back to welcome</a> 
</div> 
を見ます

私はWindowsのどこにアプリケーションを実行するWAMPサーバーを持っている。私も青空のWebアプリケーションに公開しようとしましたが、ビューはそこにリフレッシュされませんでした。私は...それはWebサーバの問題ではありませんので、ブラウザの更新ボタンをクリックする必要がありました

+0

ああ、問題を発見した...私はngAnimateのdepencyを削除し、今では働いています。 – japesu

答えて

1

ワーキングPlunker:http://plnkr.co/edit/aCpOumYzy94ATMXiA5KR?p=preview

ルーティングが正しく設定されていますが、あなたは、コントローラへの参照を追加しませんでしたビューのために。また、メインビューにngAnimateの依存ファイルが必要です。

<div data-ng-view="" data-ng-controller="rispaController" ></div>

+0

ええ、問題はngAnimateにありました。答えをありがとう:) – japesu

関連する問題