在Laravel和Angular Project中单独使用AngularJS控制器文件

Question

我尝试这个解决方案

/sf/answers/1406137771/

/sf/answers/2431066081/

然后我收到了这个错误

获取http:// localhost:8000/js/TaskController.js net :: ERR_ABORTED 404(未找到)

然后我检查这个解决方案

https://github.com/angular/angular-cli/issues/8371

我的问题:我有一个Laravel和角度应用程序工作正常,但我想App.js通过将控制器分离到不同的文件使文件更清洁,我尝试了一些解决方案,我认为他们不适用于Laravel.

app.js

var app = angular.module('LaravelCRUD', []
    , ['$httpProvider', function ($httpProvider) {
        $httpProvider.defaults.headers.post['X-CSRF-TOKEN'] = $('meta[name=csrf-token]').attr('content');
    }]);


 app.controller('StudentController', ['$scope', '$http', function ($scope, $http) {
//Some code here that works fine 
}]);

我也app.blade.php像这样更新我的文件

//somecodes
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
<script src="{{ asset('js/TaskController.js') }}" defer></script>
//somecodes

我想创建一个StudentController.js包含此控制器代码的文件.

我使用这些版本

Angular CLI: 6.1.4
Node: 8.11.4
OS: win32 x64
Angular: undefined
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.7.4 (cli-only)
@angular-devkit/core         0.7.4 (cli-only)
@angular-devkit/schematics   0.7.4 (cli-only)
@schematics/angular          0.7.4 (cli-only)
@schematics/update           0.7.4 (cli-only)
rxjs                         6.2.2 (cli-only)
webpack                      3.12.0

和Laravel 5.7

Answer 1

你提到的第二个链接是正确的,但请记住,你应该考虑在Laravel&Angular项目中

<script src="{{ asset('js/----.js') }}" defer></script>

将提供公用文件夹的链接.但是app.js你编写角度代码的文件位于resources\assets\js\app.js 当时你应该创建你TaskController.js的文件中的public/jsnot resources\assets\js\.

试试这个代码app.js

var app = angular.module('LaravelCRUD', [
       'myTaskController'
       ]
       , ['$httpProvider', function ($httpProvider) {
           $httpProvider.defaults.headers.post['X-CSRF-TOKEN'] = $('meta[name=csrf-token]').attr('content');
       }]);

你的TaskController.js位于 public/js

angular.module('myTaskController', []).controller('TaskController', ['$scope', '$http', function ($scope, $http) {
   }]);

最后,将您的TaskController添加到您的 app.blade.php

<script src="{{ asset('path/ to /TaskController.js') }}" defer></script>