2015-11-23 2 views
1

Мы пытаемся настроить Angular для довольно простого проекта с использованием Gulp, но мы как-то потерпим неудачу при первом препятствии. Вот то, что мы создали, более или менее:Угловая не найдена до тех пор, пока она не понадобится?

index.html:

<!doctype html> 
<html ng-app="testModule"> 

    <head> 
    <meta charset="utf-8"> 
    <title>Test Module</title> 
    <meta name="description" content=""> 
    <!-- inject:css --> 
    <!-- endinject --> 
    </head> 

    <body> 
    <div ng-view></div> 

    <!-- inject:js --> 
    <script src="/angular-route.js"></script> 
    <script src="/angular.js"></script> 
    <!-- endinject --> 

    <!-- inject:bundle:js --> 
    <script src="/bundle.js"></script> 
    <!-- endinject --> 
    </body> 
</html> 

bundle.js:

// A bunch of stuff inserted by Gulp. 
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){ 
'use strict'; 

var angular; 

(function() { 

    angular.module('testModule', ['ngRoute']); 

    angular.module('testModule').config(['$routeProvider', function ($routeProvider) { 
     $routeProvider.when('/foo', { 
      template: '<p>Hi.</p>' 
     }).otherwise({ 
      redirectTo: '/foo' 
     }); 
    }]); 
})(); 

},{}]},{},[1]) 


//# sourceMappingURL=bundle.js.map 

Это кажется достаточно простой, чтобы быть надежной, но здесь являются ошибки мы получаем:

угловой route.js: 24: Uncaught TypeError: Cannot read property 'module' of undefined bundle.js: 8: Uncaught TypeError: Cannot read property 'module' of undefined angular.js: 4458: Uncaught Error: [$injector:modulerr] Failed to instantiate module testModule due to: Error: [$injector:nomod] Module 'testModule' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Это почти похоже на то, что браузер не знает, что угловой существует при обработке angular-route и bundle, и только цифры его позже. Как мы можем заставить браузер обнаруживать наличие углового раньше, так что все работает?

+0

вам нужно включить 'angular.js' сценарий перед' углового-route.js 'script – rob

+0

@rob: мы попробовали это, и оно устранило ошибку из' angular-route.js', но оно все еще обрабатывает скрипт 'bundle.js' перед' angular.js', даже если он импортирован позже. – TheSoundDefense

ответ

0

Вам не нужно инициализировать переменную angular вручную.

Вот plunker, и вы заметите, что мы принесли право на мнение для /foo: http://plnkr.co/edit/dxo3ZUJIWLeFw9HXF80w?p=info

angular.module('testModule', ['ngRoute']) 
    .config(['$routeProvider', function ($routeProvider) { 
     $routeProvider.when('/foo', { 
      template: '<p>Hi.</p>' 
     }).otherwise({ 
      redirectTo: '/foo' 
     }); 
    }]); 
+1

Оказывается, что инициализация «углового» вручную вызывала проблему. Он отлично работал в предыдущих проектах, поэтому я не уверен, почему он ломался здесь. Тем не менее, теперь работать отлично. Благодаря! – TheSoundDefense

+1

Хорошая находка, похоже, что двойной экземпляр не имел никакого эффекта. Обновленный мой ответ, чтобы отразить это, вы узнаете что-то новое каждый день! – lux

Смежные вопросы