2017-11-16 1 views
0

내 각진 앱 코드를 정리하려고했습니다. 그래서 모든 컨트롤러를 자신의 파일로 옮겼습니다. 내가 컨트롤러를 이동할 때, 내 주요 응용 프로그램은 작업 중이 야하고 아래의 예외를 던지기 시작 - 각도 던지기 예외 '모듈을로드 할 수 없습니다'!

Error: $injector:modulerr Module Error

가 그럼 난 모듈이로드되지 않는 이유에 대한하지만 운 검색을 시도했다.

main.js /*File where app module is declared*/ 

var app = angular.module('app', ['ngRoute','thatisuday.dropzone','UserController','LinkController','articleController']); 

컨트롤러 파일에 대한 종속성을 주입하려고 시도했습니다.

컨트롤러 :

링크 컨트롤러

var app = angular.module('app'); 

app.controller('LinkController', ['$scope','$http','$sce',function ($scope, $http, $sce) { 
/*Sce declaration required for proxy settings*/ 
$scope.renderHtml = function (html_code) { 
    return $sce.trustAsHtml(html_code); 
}; 

$scope.trustSrc = function (src) { 
    return $sce.trustAsResourceUrl(src); 
}; 

/*First AJAX request which gets all the links and categories for the user*/ 

$http({ 
    method: 'GET', 
    url: '/users' 
}).then(function successCallback(response) { 

    $scope.user = response.data; 

}, function errorCallback(response) { 

}); 

$scope.getUser = function() { 
    $http({ 
     method: 'GET', 
     url: '/users' 
    }).then(function successCallback(response) { 

     $scope.user = response.data; 

    }, function errorCallback(response) { 

    }); 
}; 


$http({ 
    method: 'GET', 
    url: '/links' 
}).then(function successCallback(response) { 

    this.orderProp = 'age'; 

    /*the response is saved in scope variables*/ 
    $scope.links = response.data[0]; 
    $scope.categories = response.data[1]; 
    $scope.categorytolink = response.data[2]; 


}, function errorCallback(response) { 
    console.log('There was a problem! Refresh!'); 
}); 

/*AJAX request for getting the recommendations according to the most viewed stars*/ 

$http({ 
    method: 'GET', 
    url: '/recommendations/top' 
}).then(function successCallback(response) { 

    $scope.recommendations = response.data; 

}, function errorCallback(response) { 

}); 

/*AJAX request when a user clicks a link retrieves the link data*/ 
$scope.getLinkData = function (link) { 
    $http({ 
     method: 'GET', 
     url: "/proxy", 
     headers: { 
      "X-Proxy-To": link.rss_link 
     } 
    }).then(function successCallback(response) { 

     /*AJAX request: add a star to the link*/ 

     $http.post('/links/' + link.id + '/views/add', {'link': link}).then(function successCallback(data, status, headers, config) { 

      // Manually increment star for link just clicked 

      var $data; 

      $data = data.data; 

      $scope.link = $data; 

      console.log('200 OK! Star added'); 

     }, function errorCallback() { 

      console.log('Error!'); 

     }); 

     /*The data will be retrieved and will be sorted according to the requirements of welcome.blade*/ 

     $myXml = response.data; 

     $xmlObj = $.parseXML($myXml); 

     $newsItems = []; 

     $channelImage = $($xmlObj).find("channel>image"); 

     /*the information of the link is sorted */ 

     $linkData = { 
      "title": $channelImage.find("title").text(), 
      "link": $channelImage.find("link").text(), 
      "imgurl": $channelImage.find("url").text() 

     }; 

     /*the data is sorted below*/ 

     $.each($($xmlObj).find("item"), function (index, value) { 
      $newsItems.push({ 
       "title": $(value).find("title").text(), 
       "description": $(value).find("description").text(), 
       "link": $(value).find("link").text(), 
       "date_published": moment($(value).find("pubDate").text()).format('MMMM Do YYYY'), 
       "time_published": moment($(value).find("pubDate").text()).format('h:mm:ss a'), 
       "guid": $(value).find("guid").text() 
      }) 
     }); 

     $scope.newsItems = $newsItems; 

     $scope.linkData = $linkData; 

    }, function errorCallback(response) { 

    }); 
}; 


/*Create a category private to the user*/ 

$scope.create_category = function (category) { 

    /*AJAX request: adds a new category*/ 
    $http.post('/categories/new', {'category': category}).then(function successCallback(response) { 

     /*AJAX request: Updates the categories for the use of new category*/ 

     $http({ 
      method: 'GET', 
      url: '/categories' 
     }).then(function successCallback(response) { 

      $scope.categories = response.data; 

     }, function errorCallback(response) { 

     }); 
    }, function errorCallback(response) { 

    }); 

}; 
}]); 

사용자 컨트롤러

var app = angular.module('app'); 

app.controller("UserController", ['$scope','$http','$sce', function ($scope, $http, $sce) { 

/*Sce declaration required for proxy settings*/ 
$scope.renderHtml = function (html_code) { 
    return $sce.trustAsHtml(html_code); 
}; 

$scope.trustSrc = function (src) { 
    return $sce.trustAsResourceUrl(src); 
}; 

$scope.dzOptions = { 
    paramName: "file", 
    dictDefaultMessage: "<h4><i class='fa fa-camera'></i> <b>Upload</b></h4>", 
    createImageThumbnails: false, 
    autoDiscover: false 
}; 

$scope.dzCallbacks = { 
    'sending': function (file, xhr, formData) { 
     formData.append('_token', $('#csrf-token').val()); 
    }, 
    'success': function (file, response) { 
     $scope.user = response; 
     $.notify("Profile photo changed!", "success", {autoHide: true, autoHideDelay: 500}); 
    } 
}; 

/*Update user info*/ 
$scope.updateUser = function() { 
    /*AJAX request: update user info*/ 
    $http.post('/users/update', { 
     'name': $scope.user.name, 
     'username': $scope.user.username, 
     'email': $scope.user.email 
    }).then(
     function successCallback(data) { 
      $scope.user = data; 
      $.notify("User updated!", "success", {autoHide: true, autoHideDelay: 500}); 
      console.log('200 OK! User updated'); 
     }, function errorCallback() { 
      console.log('Error!'); 
     }); 
}; 

}]); 

제 컨트롤러

var app = angular.module('app'); 

app.controller("articleController", ['$scope','$http','$sce', function ($scope, $http, $sce) { 

/*Sce declaration required for proxy settings*/ 
$scope.renderHtml = function (html_code) { 
    return $sce.trustAsHtml(html_code); 
}; 

$scope.trustSrc = function (src) { 
    return $sce.trustAsResourceUrl(src); 
}; 

/*Populates the comments for particular 
* */ 
$scope.populatecomments = function (newsItem) { 
    $http({ 
     method: 'GET', 
     url: '/articles/' + newsItem.guid + '/comments' 
    }).then(function successCallback(response) { 

     $scope.comments = response.data; 

    }, function errorCallback(response) { 

    }); 
}; 

$scope.data = []; 
$scope.comment = []; 
$scope.btn_add = function (newsItem) { 
    if ($scope.txtcomment != '') { 
     $scope.data.push({ 
      "comment": $scope.txtcomment, 
      "guid": newsItem.guid 
     }); 
     $http.post('/comments/new', { 
      "comment": $scope.txtcomment, 
      "guid": newsItem.guid 
     }).then(function successCallback() { 

      var encodedURI = encodeURIComponent(newsItem.guid); 

      $http({ 
       method: 'GET', 
       url: '/articles/' + encodedURI + '/comments' 
      }).then(function successCallback(response) { 

       $scope.comments = response.data; 

       $scope.txtcomment = ""; 

      }, function errorCallback(response) { 

      }); 
     }, function errorCallback() { 

      console.log('Error comment!'); 
     }); 

    } 
}; 

$scope.savearticle = function (newsItem) { 
    $http.post('/saved-articles/save', newsItem).then(function successCallback(response) { 
     /*console.log(document.getElementById("save/"+newsItem.guid).className="disabled");*/ 
    }, function errorCallback(response) { 

    }); 
} 

/** 
* The saved articles by the user will be retrieved when a button clicked 
*/ 

$scope.getSavedArticles = function() { 

    /*AJAX request: retreive the saved the saved articles for the user*/ 

    $http({ 
     method: 'GET', 
     url: '/saved-articles' 
    }).then(function successCallback(response) { 

     $scope.linkData = null; 

     $scope.newsItems = response.data; 


    }, function errorCallback(response) { 

    }); 
}; 
}]); 

HELP 필요!

답변

1

각 컨트롤러 파일에서 모듈을 선언 할 필요가 없습니다. 각 컨트롤러의 줄을 제거하십시오.

var app = angular.module('app'); 
0

종속성과 같은 모듈에 컨트롤러를 주입하고 있습니다. 당신의 main.js이에 파일을

변경 :

var app = angular.module('app', ['ngRoute','thatisuday.dropzone']); 

@Sajeetharan 바로 당신이 모든 컨트롤러의 모듈 선언을하지 않아도됩니다.

귀하의 의견에 따라 laravel을 사용하고 있으므로, (모두 사용하기 때문에 그것은 당신의 블레이드 템플릿과 충돌 할 것 같은 {{}} 변수)

이 작업을 수행하는 두 가지 방법이 있습니다 :

변경 각도 태그

var app = angular.module('app', [], function($interpolateProvider) { 
     $interpolateProvider.startSymbol('<%'); 
     $interpolateProvider.endSymbol('%>'); 
    }); 

Now Laravel will use the {{ variableName }} and Angular will use <% variableName %>.

변경 Laravel 블레이드 태그

Blade::setContentTags('<%', '%>');// for variables and all things Blade 
Blade::setEscapedContentTags('<%%', '%%>');// for escaped data 

Variables will be: <% $variable %>. Comments will be: <%-- $variable --%>. Escaped data will look like: <%% $variable %%>.

자세한 내용은 Tutorial에서 확인할 수 있습니다.

+0

나는 모든 주사를 삭제하려고 시도했다. 또한 모듈에 대한 중복 모듈 정의를 삭제했습니다. 아직로드되지 않은 예외를 던지고 있습니다. –

+0

ngRoute, thatisuday.dropzone도 제거 했습니까? 당신에게 html 구조도 공유하십시오! –

+0

아니요 'ngRoute'및 thatisuday.dropzone을 제거하지 않았습니다. var app = angular.module ('app', [ 'ngRoute', 'thatisuday.dropzone']); –

관련 문제