角度1のルーティングでエラーが発生しました

約ページへのルーティングにエラーが発生しています。ホームページが正常に読み込まれています。私は新しい角度になっています。それをうまくやってください。ここコードリンクは角度1のルーティングでエラーが発生しました

enter code herePlunker Link

検索コードここ index.htmlを

<!DOCTYPE html> 

    <head> 
     <title>Title</title> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
     <meta name="description" content=""> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-bootstrap/0.5pre/assets/css/bootstrap.min.css"> 
     <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> 
     <link rel="stylesheet" href="css/main.css"> 

    </head> 
    <body ng-app="demo"> 
    <div ng-view></div> 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-route.min.js"></script> 


    <script src="js/main.js"></script> 

    </body> 
    </html>

あるJsの

//コードをここに

を行きます

出典

2017-03-24 Ram Ratan Bairar

* *？ここに「enter code here」はバイパスされません。 – Mistalis

私はそれがうまくいくと思いました。問題のコードを見つけてください。 –

*正確に*あなたはエラーになりますか？「約ページにルーティングする際にエラーが発生する」とは、問題の十分な説明ではありません。期待していないことは何が起こっているのですか？コンソールに表示されるエラーメッセージは何ですか？何が起こるはずですか？この情報を含めるには質問を編集してください。 [ここではどのような話題がありますか？]（http://stackoverflow.com/help/on-topic）、[ask]、[mcve]を参照してください。 – Makyen

参考文献を<script src="main.js"></script>として修正し、partial/home.htmlを作成してください。それはその後動作します。

ブラウザデベロッパーツール（F12）を利用しようとすると、実際のエラーを見つけるのに役立ちます。

出典

2017-03-24 12:47:02 anoop

プランナーにはいくつかの問題があります。

プランナーバージョンで作成されたパーシャルはありません。 partials/about.htmlとpartials/home.htmlファイルを作成する必要があります。
css/main.css。ルートフォルダにstyle.cssを作成しましたが、index.htmlのcss/main.cssを参照しています。 3. main.jsへのパスが間違っていました。ファイルはルートフォルダにあり、js/main.jsと呼ばれています。 <script src="main.js"></script>
あなたは部分から経路を呼び出す必要があります。
aboutControllerでaboutメソッドを作成しました。しかし、それは家庭用コントローラになければならない。コントローラについては、about.htmlページにルーティングするときにのみインスタンス化されます。
main.jsで定義されていないURL「/ home」を参照しました。

次の作業プランナーを見つけてください。

https://plnkr.co/edit/APKWvpuTfivua5CovRp7?p=preview

// Code goes here 

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

app.config(['$routeProvider', 
    function($routeProvider) { 
     $routeProvider. 
     when('/', { 
      templateUrl: 'home.html', 
      controller: 'homeController' 
     }). 
     when('/about', { 
      templateUrl: 'about.html', 
      controller: 'aboutController' 
     }). 
     when('/login', { 
      templateUrl: 'login.html', 
      controller: 'loginController' 
     }). 
     otherwise({ 
      redirectTo: 'partials/404.html' 
     }); 
    } 
]); 


app.controller('homeController', function($scope, $http, $location){ 
$scope.login= function() { 
     $location.path("/login"); 

    } 
    $scope.about= function() { 
     $location.path("/about"); 

    } 
}); 

app.controller('aboutController', function($scope, $http) { 
    $scope.backToHome = function() { 
    window.history.back(); 
    } 
}); 
app.controller('loginController', function($scope, $http) { 
    $scope.backToHome = function() { 
    window.history.back(); 
    } 
});

のindex.html：あなただけあなたが**だけでなく、あなたの質問にあなたのコードを投稿すると言っPlunkerのリンクを投稿したときに警告を見ていない

<!DOCTYPE html> 
<head> 
    <title>Title</title> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-bootstrap/0.5pre/assets/css/bootstrap.min.css"> 
    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> 

</head> 
<body ng-app="demo"> 
<div ng-view></div> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-route.min.js"></script> 

<script src="main.js"></script> 

</body> 
</html>

出典

2017-03-24 15:21:47

このコードは問題を解決するかもしれませんが、問題を解決する方法と理由を理解するために、[説明を含む]（http://meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers）あなたの投稿の質を向上させる。あなたが今質問している人だけでなく、将来読者のための質問に答えていることを忘れないでください！説明を追加するためにあなたの答えを編集し、どのような制限と前提が適用されるかを示してください。 – Makyen

はい。私は適切な説明で答えを編集しました。希望が役立ちます。 –

角度1のルーティングでエラーが発生しました

答えて

関連する問題