javascript - Angular 资源导致 View 消失

我开始使用单一路径/login在AngularJS应用程序上工作。这是处理该路由的Controller的代码。

angular = require('angular');
// require('../resources/loginResource');


var di = ['$scope'];

var controller = function LoginCtrl($scope) {
  $scope.myArray = [
    "foo",
    "bar",
    "baz"
  ];
};

angular.module('myApp', [])
  .controller('LoginCtrl', di.concat(controller) );

当文件的第二行（对loginResource的引用）被注释时，页面/ login看起来就很好。但是，当我取消注释时，页面将显示为空白。没有控制台错误，终端输出中没有任何内容。

这是loginResource文件：

angular = require('angular');
require('angular-resource');

var app = angular.module('myApp', ['ngResource']);

var di = ['$resource'];

var myResource = function Foobar($resource) {
  return $resource('http://mockbin.org/bin/c7bb5923-18ec-4e2f-9189-df8fb80b606b');
};

app.factory('Foobar', di.concat(myResource));

我正在用gulp和Browserify。

这似乎是注入使用$service的服务的正确方法。如果是这样，为什么页面呈现空白？

最佳答案

问题将是myApp模块的重复定义。在第一个代码段中，您具有：

angular.module('myApp', [])

第二秒钟，您将拥有：

var app = angular.module('myApp', ['ngResource']);

您需要在第二个代码段中为模块使用其他名称，并且需要在应用程序模块的配置中包括该名称。

将第一个代码段更改为以下内容：

angular = require('angular');
require('../resources/loginResource');
...
angular.module('myApp', ['loginResource']) ...

并将第二个更改为以下内容（也可以重命名app变量，因为它不是应用程序模块，这也是个好主意）：

angular = require('angular');
require('angular-resource');

var mod = angular.module('loginResource', ['ngResource']);
...
mod.factory('Foobar', di.concat(myResource));

关于javascript - Angular 资源导致 View 消失，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39376963/