angularjs с requirejs не работает

Question

Попытка реализовать угловую систему с требованиями.

Я следую за this.

Не добиться успеха!

Частицы не загружаются. Ошибок в консоли. Angularjs не работает: i.e, когда я просто пишу в HTML как: {{1 + 2}}, он не печатает 3, а как {{1 + 2}}.

main.js

var base_url="http://localhost/ums/angular/js"; 
require.config({ 
    paths: { 
     'angular': base_url+'/angular.min', 
     'ngRoute': base_url+'/angular-route.min', 
     'angularControllers': base_url+'/admin/demo_angular', 
     'flash': base_url+'/angular-flash', 
     'angular-loading-bar': base_url+'/loading-bar.min', 
     'ngAnimate': base_url+'/angular-animate.min', 
     'ui.bootstrap': base_url+'/ui-bootstrap-tpls-0.12.0', 
     'input_match': base_url+'/angular-directives', 
     'uniqueField': base_url+'/angular-directives', 
     'uniqueEdit': base_url+'/angular-directives', 
     'angularAMD': base_url+'/angularAMD.min', 
     'app': base_url+'/admin/app', 

    }, 
    waitSeconds: 0, 
    shim: { 
    'angularAMD': ['angular'], 
    'ngRoute': ['angular'] , 
    'angular-loading-bar': ['angular'] , 
    'ngAnimate': ['angular'] , 
    'ui.bootstrap': ['angular'] , 
    'input_match': ['angular'] , 
    'uniqueField': ['angular'] , 
    'uniqueEdit': ['angular'] , 
    'angularControllers': ['angular','flash'] , 
    'flash': ['angular'] , 
    'app':['angular'], 
    }, 
    deps: ['app'] 
}); 

app.js

var base_url="http://localhost/ums/"; 
define(['angularAMD', 'ngRoute','angularControllers','flash','angular-loading-bar','ngAnimate','ui.bootstrap','input_match','uniqueField','uniqueEdit'], function (angularAMD) { 
var app = angular.module('angularapp', ['ngRoute','angularControllers','flash','angular-loading-bar','ngAnimate','ui.bootstrap','input_match','uniqueField','uniqueEdit']); 
app.config(['$routeProvider', function($routeProvider){ 
    $routeProvider 
     .when('/add_user', angularAMD.route({ 
      title : 'Add User', 
      controller : 'AddUserCtrl', 
      templateUrl : base_url+'angular/partials/admin/add_user.php', 
     })) 
     .when('/edit_user/:user_id', angularAMD.route({ 
      title : 'Edit User', 
      controller : 'EditUserCtrl', 
      templateUrl : base_url+'angular/partials/admin/edit_user.php' 
     })) 
     .when('/all_users', angularAMD.route({ 
     title : 'All Users', 
      controller : 'allUsersCtrl', 
      templateUrl : base_url+'angular/partials/admin/all_users.php' 
     })) 
     .when('/dashboard', angularAMD.route({ 
      title : 'Dashboard', 
      controller : 'dashboardCtrl', 
      templateUrl : base_url+'angular/partials/admin/dashboard.php' 
     })) 
      .when('/charts', angularAMD.route({ 
      title : 'Charts', 
      controller : 'dashboardCtrl', 
      templateUrl : base_url+'angular/partials/admin/charts.php' 
     })) 
     .when('/dropdown_demo', angularAMD.route({ 
      title : ' Dropdown Demo', 
      controller : 'dropdownDemo', 
      templateUrl : base_url+'angular/partials/admin/test_dropdown.php' 
     })) 
     .otherwise({ 
      redirectTo : '/dashboard' 
     }); 
}]); 
app.run(['$rootScope', '$route', function($rootScope, $route) { 
    $rootScope.$on('$routeChangeSuccess', function() { 
     document.title = $route.current.title; 
    }); 
}]); 
//service demo 
app.factory('notify', ['$window', function(win) { 
    var msgs = []; 
    return function(msg) { 
    msgs.push(msg); 
    if (msgs.length == 3) { 
     win.alert(msgs.join("\n")); 
     msgs = []; 
    } 
    }; 
}]); 

    // Bootstrap Angular when DOM is ready 
    return angularAMD.bootstrap(app); 

}); 

demo_angular.js (контроллеры)

var base_url="http://localhost/ums/"; 
var angularControllers = angular.module('angularControllers', ['flash']); 
angularControllers.controller('AddUserCtrl', ['$scope','$http', '$timeout','Flash', function($scope,$http, $timeout,Flash){ 
// doing some stuff 
}]); 
//..... other controllers... 

Примечание:Перед выполнением requirejs все было в порядке. (я просто пытаюсь реализовать ленивые нагрузки)

Answer 1

Вот один рабочий примера на основе коды: http://plnkr.co/edit/Y3XpQKa5b9oqaL7aByP4?p=preview

Я раздел код ваших.

main.js:

var base_url="//cdnjs.cloudflare.com/ajax/libs/"; 
require.config({ 
    paths: { 
    'angular': base_url + 'angular.js/1.2.16/angular.min', 
    'ngRoute': base_url + 'angular.js/1.2.16/angular-route.min', 
    'ngAnimate': base_url + 'angular.js/1.2.16/angular-animate.min', 
    'angularAMD': 'http://cdn.jsdelivr.net/angular.amd/0.2/angularAMD.min', 
    'app': 'app' 
    }, 
    waitSeconds: 0, 
    shim: { 
    'angular': { 
     exports: 'angular' 
    }, 
    'angularAMD': { 
     deps: ['angular'] 
    }, 
    'ngRoute': { 
     deps: ['angular'] 
    }, 
    'ngAnimate': { 
     deps: ['angular'] 
    }, 
    'ngAnimate': { 
     deps: ['angular'] 
    }, 
    'app': { 
     deps: ['angular'] 
    } 
    }, 
    deps: ['app'] 
}); 

app.js: Вы забыли включить угловые и controllerUrl.

var base_url="/"; 

define(['angular', 'angularAMD', 'ngRoute', 'ngAnimate'], function (angular, angularAMD) { 

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

    app.config(['$routeProvider', function($routeProvider){ 

    $routeProvider 
     .when('/add_user', angularAMD.route({ 
      title : 'Add User', 
      controller : 'AddUserCtrl', 
      templateUrl : 'add_user.html', 
      controllerUrl: 'demo_angular.js' 
     })) 
     .otherwise({ 
      redirectTo : '/dashboard' 
     }); 
    }]); 

    return angularAMD.bootstrap(app); 
}); 

demo_controller.js: Попробуйте включить приложение вместо угловой.

define(['app'], function (app) { 

    app.controller('AddUserCtrl', ['$scope','$http', '$timeout', function($scope,$http, $timeout){ 
    console.log('AddUserCtrl'); 
    }]); 

});