3

これが私のindex.htmlです

<!DOCTYPE html>
<html data-ng-app="BookApp" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="Scripts/jquery-2.1.0.js"></script>
    <script src="Scripts/bootstrap.js"></script>
    <script src="Scripts/angular.js"></script>
    <script src="Scripts/angular-resource.js"></script>
    <script src="Scripts/app.js"></script>
    <link rel="stylesheet" type="text/css" href="Content/bootstrap.css"/>
    <title>My Book</title>
</head>
<body>
    <div class="container">
        <div data-ng-view=""></div>// I suspect this line is wrong
    </div>
</body>

これが私のapp.jsです

var NoteApp = angular.module("BookApp", ["ngResource"]).
config(function($routeProvider) {
    $routeProvider.
        when('/', { controller: ListCtrl, templateUrl: 'book.html' }).
        otherwise({ redirectTo: '/' });
});

var ListCtrl = function($scope, $location) {
$scope.book = "test pass";
};

ここに私のbook.htmlがあります

<h1>Hello: {{book}}</h1>

アプリケーションを実行しても何も表示されません。これをどのようにデバッグできますか? 何が間違っている可能性がありますか？私もng-viewを真実にしましたが、VS Studioは「属性の後に=記号を付ける必要があります」と言っています...しかし、=記号を使用して何を割り当てる必要がありますか?

ここに例外があります

キャッチされないエラー: [$injector:modulerr] モジュール BookApp のインスタンス化に失敗しました: エラー: [$injector:unpr] 不明なプロバイダー: $routeProvider

ngRoute を追加して以下の変更を行いました

var TodoApp = angular.module("TodoApp", ["ngResource","ngRoute"])

問題は解決しましたが、ベスト プラクティスは何ですか?

4

0 に答える 0