Question

我有调用Factory的js控制器：

(function() {
  'use strict';
  angular
    .module('projectAlabama')
      .controller('indexResourceListController', indexResourceListController);

  indexResourceListController.$inject = ['resourceListFactory'];

  function indexResourceListController(resourceListFactory) {
    var vm = this;

    resourceListFactory.query().$promise.then(function(data) {
      vm.lists = data.splice(0, limit);
    });
  }
})();

将角度纳入项目的两种方法 - 不同的结果。

第一个：使用资产管道

的Gemfile

source 'https://rails-assets.org'
gem 'rails-assets-angular'
gem 'rails-assets-ng-resource'

的application.js

//= require angular
//= require ng-resource
//= require angular-route
//= require angular-rails-templates
//= require angular-material

//= require app
//= require_tree ./templates
//= require_tree ./controllers
//= require_tree ./factories

错误！

angular.self.js?body=1:13643 TypeError: Cannot read property 'then' of undefined
at new indexResourceListController

使用CDN的第二种方法：

layout.html.erb

  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-resource.min.js"></script>

一切顺利。

有人能解释我为什么吗？

Answer 1

我认为你必须在你的宝石文件中做一些修补。

 source 'https://rails-assets.org' 
 gem 'rails-assets-angular'
 gem "rails-assets-angular-resource"

并在您的application.js

中

 //= require angular-resource

并尝试删除//= require_tree .我认为现在应该可以使用。

Answer 2

将此需要代码拉入单独的文件中，然后在应用程序中需要此文件。您也可以在浏览器中检查网络选项卡，看看在ngresource之后或之前是否加载了角度。

Answer 3

我强烈认为您可能遇到了一些版本问题，或与资产订购相关的问题。我有Angular Rails，工作得很好。唯一的区别是我用bower来管理下载和安装我需要的资产。

{
  "name": "MyApp",
  "version": "0.0.1",
  "description": "",
  "dependencies": {
    "angular": "1.5.0",
    "angular-resource": "1.5.0",
    "angular-route": "1.5.0",
    "many-more" : "*"
  },
  "devDependencies": {},
  "resolutions": {
    "angular": "1.5.3"
  }

}

的application.js

//= require jquery
//= require bootstrap
//= require angular
//= require angular-resource
//= require angular-route
//= require angular-rails-templates

//= require ng-app/app
//= require_tree ../templates
//= require_tree ../javascripts/ng-app

请注意，application.js中的顺序非常重要。它会根据上述顺序消化文件。

Answer 4

因为Angular需要一些技巧：

1）尽可能避免使用jQuery 2）Turbolinks可能会导致冲突 3）如果你需要使用jquery，请记住包装与jquery的兼容性

basic reference

为什么Angular在使用Rails资产管道包含它时不起作用？

4 个答案: