14

Chrome でデバッグを使用しているときに、angular.js:36 で「オブジェクトがキャッチされていません」というエラーが表示され続けます。

私は何を間違っていますか？:/

助けてくれてありがとう:)

モジュールおよびリソース オブジェクト (services.js)

var services = angular.module('ngdemo.services', ['ngResource']);

services.factory('ProvidersFactory', function ($resource) {
    return $resource('http://devfz.azurewebsites.net/api/providers/', {}, {
        query: { method: 'GET', isArray: true },
    })
});

コントローラー (controller.js)

var app = angular.module('ngdemo.controllers', []);

app.controller('ProviderListCtrl', ['$scope', 'ProvidersFactory', '$location',
    function ($scope, ProvidersFactory, $location) {
        $scope.providers = ProvidersFactory.query();
    }]);

app.js

angular.module('ngdemo', ['ngdemo.filters', 'ngdemo.services', 'ngdemo.directives', 'ngdemo.controllers']).
config(['$routeProvider', function ($routeProvider) {
    $routeProvider.when('/provider-list', { templateUrl: '/provider-list.html', controller: 'ProviderListCtrl' });
    $routeProvider.otherwise({ redirectTo: '/provider-list' });
}]);

HTML

<!DOCTYPE html>
<html ng-app="ngdemo" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Providers</title>
    <link href="Content/bootstrap.min.css" rel="stylesheet">
    <script src="Scripts/Vendor/angular.min.js"></script>
    <script src="Scripts/Vendor/angular-resource.js"></script>
    <script src="controller.js"></script>
    <script src="services.js"></script>
    <script src="app.js"></script>
</head>
<body role="document" style="padding-top: 70px; padding-bottom: 30px">
    <div class="container body-content" role="main">
        <div ng-controller="ProviderListCtrl">
            <h2>Providers</h2>
            <hr>
            <div style="width:60%">
                <table class="table table-striped table-condensed">
                    <thead>
                        <tr>
                            <th style="min-width: 30px; width: 30px;">Id</th>
                            <th style="min-width: 100px;">Name</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="provider in providers">
                            <td valign="middle">Test: {{provider.Id}}</td>
                            <td valign="middle">Test: {{provider.Name}}</tdvalign>
                            <td valign="middle" align="right" width="40px"><a ng-click="" class="btn btn-small btn-primary">edit</a></td>
                            <td valign="middle" align="right" width="50px"><a ng-click="" class="btn btn-small btn-danger">delete</a></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</body>
</html>
4

2 に答える 2

23

Safariブラウザでデバッグしてみてください。私にとっては、このエラーに関する詳細情報が得られます。私の場合、angular-seedアプリを使用し、' myApp ' モジュールの名前を ' myNameOfAppApp ' に変更します。でこのエラーを受け取りましたSafari:

エラー: [$injector:modulerr] モジュール myApp のインスタンス化に失敗しました: [$injector:nomod] モジュール 'myApp' は利用できません! モジュール名のつづりを間違えたか、モジュールをロードするのを忘れました。モジュールを登録する場合は、依存関係を 2 番目の引数として指定してください。

「 mayApp」キーワードで検索しようとしましたが、 index.htmlで名前を変更した後、エラーが修正されました。

于 2014-06-01T13:04:21.733 に答える