Railsアプリケーション内に角を与えるエラー

私は2つのアプリを持っています。どちらもRailsアプリケーションで、両方ともAngularを使用しています。 1つのアプリケーション、正しく角度の作品では、他のアプリケーションでは、角度は私にこのエラーを与えている。ここでRailsアプリケーション内に角を与えるエラー

Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to: 
Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

は私のコードは次のとおりです。

Application.html.erb

<!DOCTYPE html> 
<html lang="en-US" ng-app="myApp"> 
<head> 
    <meta charset="utf-8"> 
    <title>MyApp</title> 
    <%= smart_stylesheet_link_tag media: "all", "data-turbolinks-track" => true %> 
    <%= csrf_meta_tags %> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script> 
<body> 
<%= yield %> 
</body> 
</html>

Application.js

//= require angular 
//= require bighorn/dist/bighorn 
//= require jquery 
//= require jquery_ujs 
//= require jquery-autogrow-textarea/src/jquery.autogrow.js 
//= require turbolinks 
//= require lodash/lodash 
//= require humane-js/humane 
//= require ahoy 
//= require bootstrap-sprockets 
//= require bootstrap-datepicker/js/bootstrap-datepicker 
//= require nprogress 
//= require nprogress-turbolinks 
//= require corejs-typeahead/dist/bloodhound 
//= require corejs-typeahead/dist/typeahead.jquery 
//= require main 
//= require jobs 
//= require static

Gemfile

gem "rails",      "4.2.5.1" 
gem "pg",       "0.18.4" 
gem "activerecord-postgis-adapter", "3.1.4" 
gem "sass",       "3.4.13" 
gem "sass-rails",     "5.0.1" 
gem "bootstrap-sass",    "3.3.5.1" 
gem "font-awesome-rails",   "4.4.0.0" 
gem "uglifier",      "2.7.1" 
gem "simple_form",     "3.1.0" 
gem "valid_email",     "0.0.11" 
gem "jquery-rails",     "4.0.3" 
gem "turbolinks",     "2.5.3" 
gem "jbuilder",      "2.2.12" 
gem "activerecord-session_store", "0.1.1" 
gem "ahoy_matey",     "1.2.1" 
gem "browser",      "1.1.0" 
gem "oj",       "2.12.14" 
gem "carmen-rails",     "1.0.1" 
gem "compass-rails",    "2.0.4" 
gem "nprogress-rails",    "0.1.6.6" 
gem "devise",      "3.5.2" 
gem "devise-async",     "0.10.1" 
gem "httparty",      "0.13.7" 
gem "rugged",      "0.22.2" 
gem "sidekiq",      "4.0.2" 
gem "redis-namespace",    "1.5.2" 
gem "sitemap_generator",   "5.0.2" 
gem "okcomputer",     "1.4.0" 
gem "dalli",      "2.7.4" 
gem "mandrill_mailer",    "1.2.0" 
gem "american_date",    "1.1.0" 
gem "damerau-levenshtein",   "1.1.0" 
gem "bower-rails",     "0.10.0" 
gem "footing",      "1.0.0" 
gem "scenic",      "1.0.0" 
gem "rubyzip",      "1.1.7" 
gem "typhoeus",      "0.8.0" 
gem "gender_detector",    "0.1.2" 
gem "shortener",     "0.5.5" 
gem "coffee-script",    "~> 2.2.0" 
gem "angular-rails" 
#gem "airbrake",      "4.2.1" 

gem "passenger" 
gem "sinatra", :require => nil # for sidekiq/web 

group :development do 
    #gem "spring" 
    #gem "rack-mini-profiler" 
    #gem "flamegraph" 
    gem "raml_ruby", require: "raml" 
end 

group :development, :test do 
    gem "pry" 
    gem "pry-rails" 
    gem "pry-stack_explorer" 
    gem "pry-byebug" 
    gem "awesome_print" 
    gem "quiet_assets" 
    gem "model_probe" 
    #gem "web-console" 
end 

group :test do 
    gem "minitest" 
    gem "minitest-reporters" 
    gem "simplecov", require: false 
    gem "minitest-rails-capybara" 
    gem "guard" 
    gem "guard-minitest" 
end 

group :doc do 
    gem "sdoc" 
end

Main.js

(function() { 
    "use strict"; 

function initAngular() { 
var myApp = angular.module('myApp', []); 
myApp.controller("AngularController", ['$scope', '$http', function($scope, $http){ 
    $http.get('/assets/locations.json').success(function(data){ 
    console.log(data); 
    $scope.locations = data; 
    }); 
}]); 
} 

function init() { 
    _.delay(function() { 
     initAngular(); 
    }, 100); 
    } 

    $(document).ready(init); 
    $(document).on("page:load", init); 
}());

Test.html.erb]

出典

2016-03-28 Ctpelnar1988

<div ng-controller="AngularController"> 
<input type="text" ng-model="name"> 
<p>{{name}}</p> 
</div>

エラーがアプリがインスタンス化されなかったことを示し。このエラーは、init関数が完了する前にng-app指示が実行されたために発生します。この問題を解決するには

、手動でアプリケーションを初期化するためにangular.bootstrapメソッドを使用する必要があります：私は、ファイルから機密情報を削除したとき、

main.js

var myApp = angular.module('myApp', []); 
myApp.controller("AngularController", ['$scope', '$http', function($scope, $http){ 
    $http.get('/assets/locations.json').success(function(data){ 
    console.log(data); 
    $scope.locations = data; 
    }); 
}]); 

angular.element(document).ready(function() { 
    angular.bootstrap(document, ['myApp']); 
});

出典

2016-03-28 16:39:02 gnerkus

申し訳ありませんが、私は間違ってボディータグを取り外しました。 Application.html.erbの内部はすべて元通りであり、作業しています。私はinitAngular関数の中にconsole.log（ "HITTING FUNCTION"）を置くことによってテストし、テキストはコンソールに表示されています。何らかの理由で、モジュールがインスタンス化されていません。 – Ctpelnar1988

私は答えを更新しました。 – gnerkus

ありがとうございました！それがなぜ必要なのか少し説明できますか？ – Ctpelnar1988

Railsアプリケーション内に角を与えるエラー

答えて

関連する問題