Angular + Laravel: загрузка представления через ngRoute

Я столкнулся с этой проблемой при объединении Laravel и Angular:

Следуя очень простому руководству, которое я нашел в Интернете, я пытался для загрузки представления с помощью директивы ng-view. Однако я не могу фактически загрузить шаблон. Это мой код app.js:

(function() {

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

    app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
        $routeProvider
            .when('/inicio', {
                templateUrl: '../templates/inicio.html',
                controller: 'homeCtrl'
            })
            .otherwise({ redirectTo: '/' });
    }]);

    app.controller('homeCtrl', ['$scope', '$http', function($scope, $http) {
        $http.get('http://localhost:8888/profucom/public/getData').success(function(data) {
            $scope.datos = data;
        });
    }])

})();

Мое файловое дерево:

app/
bootsrap/
public/
   js/
      angular.min.js
      angular-route.min.js
      app.js
   templates/
      inicio.html
. . .

Сайт загружается нормально, но когда я смотрю исходный код, а не смотрю шаблон внутри inicio.html, происходит такое...

Код в моем файле index.blade.php

<div ng-view></div>

Код, который я вижу в исходном коде браузера

<!-- ng-view: -->

Вкладка network в Chrome не показывает ошибку 404 при попытке загрузить представление.

Что я пробовал до сих пор:

  1. Размещение шаблонов в папке js (templateUrl: 'templates/inicio.html')
  2. Placing templates inside the public folder (templateUrl: '../templates/inicio.html')
    • also, templateUrl: '/public/templates/inicio.html'
  3. Размещение шаблонов в корневой папке (templateUrl: '/templates/inicio.html')
  4. Размещение только файла в папке js: (templateUrl: 'inicio.html')

Ничего из вышеперечисленного не работает. Любая помощь, пожалуйста?

EDIT Я также вижу это в URL-адресе: вместо myapp/public/inicio он загружается как myapp/public/inicio#/


person Héctor Salazar    schedule 25.12.2014    source источник
comment
Я полагаю, это потому, что ваш базовый href отключен. ПЕРЕЙДИТЕ на вкладку вашей сети, какой путь он пытается включить?   -  person Ohgodwhy    schedule 25.12.2014
comment
В том-то и дело, что даже не звонит. Ошибки 404 нет, потому что к ней НЕТ звонка. Я отредактировал вопрос, чтобы сообщить о другом неизвестном поведении.   -  person Héctor Salazar    schedule 25.12.2014


Ответы (2)


Где находится ваш index.blade.php? templateUrl должен быть путем к шаблону из любого файла, загружающего код app.js (я предполагаю, что это index.blade.php). Итак, если это в корневом каталоге, templateUrl: '/public/templates/inicio.html'

Что касается проблемы с #, прочитайте этот несколько связанный вопрос

person Keenan Lidral-Porter    schedule 25.12.2014
comment
Мой index.blade.php находится в папке app/views/. Я попробовал тот же самый маршрут, который вы указали, но проблема не устранена. - person Héctor Salazar; 25.12.2014
comment
На каком URL вы это тестируете? localhost/8888/inicio или localhost/8888/#/inicio? У вас есть несколько угловых модулей в одном приложении? Меня немного смущает несоответствие myapp/public/inicio и myapp/public/inicio#/ — откуда/находится этот URL? - person Keenan Lidral-Porter; 25.12.2014
comment
Я тестирую на локальном хосте: 8888/myapp/public/inicio. Только один модуль, тот что на app.js - person Héctor Salazar; 25.12.2014
comment
Хм, возможно, где-то на вашем сервере вы обслуживаете неправильные файлы. Я не знаю, как вы это настроили, но вы всегда указываете на файл index.blade.php, независимо от маршрута? Что произойдет, если вы попробуете localhost:8888/#/myapp/public/inicio? Дополнительные сведения см. в этом вопросе. - person Keenan Lidral-Porter; 26.12.2014

И снова это была не что иное, как человеческая ошибка. Я сожалею и одновременно благодарен тем, кто потратил время, пытаясь ответить и понять мою проблему. Это решение:

Я использовал последнюю стабильную версию непосредственно из CDN, версия 1.3.5; однако - и просто чтобы посмотреть, что произойдет - я перешел на версию 1.2.28. В чем разница? Немного синтаксиса.

Вместо того, что я сделал выше...

app.controller('homeCtrl', ['$scope', '$http', function($scope, $http) {
. . .

Я сделал это:

app.controller('homeCtrl', function($scope, $http) { 
. . .

Переход от одной версии к другой был ответом и небольшим изменением синтаксиса.

Я надеюсь, что это поможет любому, столь же отвлеченному, как и я.

person Héctor Salazar    schedule 30.12.2014