Question

我正在尝试在项目中使用带有requirejs的angular-strap，我在requirejs.config.js文件中执行了以下操作：

require.config({
  baseUrl: 'app',
  paths: {
    ..........

    angular:                  '../bower_components/angular/angular',
    'angular-strap':          '../bower_components/angular-strap/dist/angular-strap.min',
    'angular-strap-tpl':      '../bower_components/angular-strap/dist/angular-strap.tpl.min',

    ..............
  },
  shim: {
    ...........

    angular: {
      deps: ['jquery'],
      exports: 'angular'
    },

    bootstrap: {
      deps: ['jquery']
    },

    jquery: {
      exports: 'jQuery'
    },

    // simple dependency declaration
    'jquery-ui':            ['jquery'],
    'jquery.flot':          ['jquery'],
    'jquery.flot.pie':      ['jquery', 'jquery.flot'],
    'jquery.flot.selection':['jquery', 'jquery.flot'],
    'jquery.flot.stack':    ['jquery', 'jquery.flot'],
    'jquery.flot.stackpercent':['jquery', 'jquery.flot'],
    'jquery.flot.time':     ['jquery', 'jquery.flot'],

    'angular-sanitize':     ['angular'],
    'angular-animate':      ['angular'],
    'angular-cookies':      ['angular'],
    'angular-dragdrop':     ['jquery','jquery-ui','angular'],
    'angular-loader':       ['angular'],
    'angular-mocks':        ['angular'],
    'angular-resource':     ['angular'],
    'angular-route':        ['angular'],
    'angular-touch':        ['angular'],

    'angular-strap':        ['angular', 'angular-animate', 'bootstrap','timepicker', 'datepicker'],
    'angular-strap-tpl':    ['angular', 'angular-strap'],

    .......
  }
});

该文件的样本（我添加了删除细节的点）。

当我尝试启动应用程序时，我收到了以下控制台日志：

GET http://localhost:8983/project/tooltip/tooltip.tpl.html 404 (Not Found) angular.js:8521
GET http://localhost:8983/project/tooltip/tooltip.tpl.html 404 (Not Found) angular.js:8521
GET http://localhost:8983/project/tooltip/tooltip.tpl.html 404 (Not Found) angular.js:8521
................................

我注意到angular-strap在baseUrl中查找这些文件，因此找不到它们。如何在正确的文件中使用angular-strap搜索模板？

Answer 1

我发现了问题并且它是注射器无法找到“angular-strap-tpl”路径，因此当在require函数中添加到app.js时它起作用了。

app.js的示例代码

define([
  'angular',
  'jquery',
  'underscore',
  'require',

  'elasticjs',
  'solrjs',
  'bootstrap',
  'angular-route',
  'angular-sanitize',
  'angular-animate',
  'angular-strap',
  'angular-strap-tpl',
  'angular-dragdrop',
  'extend-jquery'
]

然后在应用程序的手动引导程序中将“mgcrea.ngStrap”添加到依赖项数组中，如下所示：

  var apps_deps = [
    'elasticjs.service',
    'solrjs.service',
    'ngAnimate',
    'mgcrea.ngStrap',
    'ngRoute',
    'ngSanitize',
    'ngDragDrop'
  ];

这解决了问题，现在效果很好。

当与requirejs一起使用时，AngularStrap 2.x抛出404 Not Found

1 个答案: