Question

我正在开发一个模块化角度应用程序，我在angular-module-1模块中定义了I文件夹路径（常量：BASE_PATH：“path / to / folder”）。我想在位于我的应用程序的另一个模块（angular-module-2）中的角度组件中重用此常量。我想在我的项目中多次使用这个常数。

module.component("relationshipSearch", {
templateUrl: BASE_PATH +'/link/to/other/folder',

女巫是将此常量定义为在所有解决方案项目中可见的全局变量的最佳方法这是我的项目结构：

project
|-- angular-module-1
|   |-- angular-module-1.js
|   |-- angular-module-1.html
|-- angular-module-2
|   |-- angular-module-2.js
|   |-- angular-module-2.html

Answer 1

我想创建一个名为angular-common的公共模块，您可以在其中放置common内容，例如公共service，factory，directive，{ {1}}等等。

然后在constants（这将是完全独立且可插入的）模块中添加常量。如下所示

angular-common

接下来，将此常用模块注入//assuming `angular-common` is already defined angular.module('angular-common').constant('commmonSetting', { 'BASE_PATH': '/link/to/other/folder' })（这是主要模块，将在app / ng-app中使用），如下所示

bootstrap

当您想使用angular.module('app', ['angular-common', 'ngRoute', ...other dependencies..])时，只需在BASE_PATH / commmonSetting controller注入component依赖关系。

app.component('myComponent', {
  templateUrl: function(commmonSetting){
    return commmonSetting.BASE_PATH +'/link/to/other/folder';
  },
  ....
})

Answer 2

抱歉，发布在一个带有已接受答案的旧帖子上，但我想说接受的答案不是缩小安全。写这个的缩小安全方式是：

app.component('myComponent', {
  templateUrl: function($injector){
    var commmonSetting = $injector.get('namespace.CommmonSetting');
    return commmonSetting.BASE_PATH +'/link/to/other/folder';
  },
  ....
});

Answer 3

也许一种不同的方法可能有所帮助。而不是设置路径为什么不只是查看同一目录中的文件。

您可以使用require()，例如：

template: require('./template-in-same-dir.html')

请注意template而非templateUrl。

角度组件相对templateUrl

3 个答案: