2016-09-07 2 views
0

AngularJS 앱에서 단일 경로 인 /login으로 작업하기 시작했습니다. 다음은 해당 경로를 처리하는 Controller 코드입니다. 파일의 두 번째 줄, loginResource에 대한 참조가 댓글을 달았 때각도 리소스로 인해보기가 사라집니다.

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)); 

는, 페이지/로그인이 잘 나타납니다. 그러나 주석 처리를 제거하면 페이지가 공백으로 렌더링됩니다. 콘솔 오류가 없으며 터미널 출력에 아무 것도 없습니다.

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)); 

나는 꿀꺽하고 Browserify을 사용하고 있습니다 : 여기

loginResource 파일입니다.

이것은 $service을 사용하는 서비스를 주입하는 적절한 방법 인 것 같습니다. 그렇다면 왜 페이지 렌더링이 공백입니까?

답변

2

문제는 myApp 모듈의 반복 정의입니다.

angular.module('myApp', []) 

을하고 두 번째에, 당신은 : 귀하의 첫 번째 조각에서, 당신은

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

당신은 두 번째 조각에서 모듈에 대해 다른 이름을 사용해야합니다 그리고 당신은 것을 포함해야 app 모듈의 구성에있는 이름.

변경이 뭔가에 대한 첫 번째 조각 :

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));