Угловой компонент относительный templateUrl

Я разрабатываю модульное угловое приложение, в котором я определил путь к папке I (константа: BASE_PATH: «путь/к/папке») в модуле angular-module-1. Я хочу повторно использовать эту константу в компоненте angular, расположенном в другом модуле (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

javascript components angularjs angularjs-components
person Saad    schedule 03.08.2016    source источник

Ответы (3)


arrow_upward
6
arrow_downward

Я бы сказал, что создайте общий модуль с именем angular-common, где вы можете разместить common вещи, такие как обычные service, factory, directive, 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';
  },
  ....
})
person Pankaj Parkar    schedule 03.08.2016
comment
Спасибо то что нужно :) - person Saad; 03.08.2016

arrow_upward
3
arrow_downward

Извините за публикацию в старой теме с принятым ответом, но я хотел сказать, что принятый ответ не является безопасным для минимизации. Безопасный способ минификации:

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

arrow_upward
0
arrow_downward

Возможно, поможет другой подход. Вместо того, чтобы указывать путь, почему бы просто не посмотреть файл в том же каталоге.

Вы можете использовать require(), например:

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

Обратите внимание на template, а не на templateUrl.

person zilj    schedule 03.08.2016
comment
Я спрашиваю о наилучшем способе совместного использования/повторного использования константы между различными модулями углового приложения. - person Saad; 03.08.2016
comment
И все же заголовок спрашивает об URL-адресе шаблона - person zilj; 03.08.2016
comment
Я все еще думаю, что мое решение вашей конкретной проблемы стоит рассмотреть. Создав несколько модулей, вы соединили их вместе ради цепочки. Кажется перебором. Но, конечно же, есть много способов испечь торт, все зависит от того, какой вкус нам больше всего нравится! :) - person zilj; 03.08.2016
comment
У меня есть много шаблонов в одной папке, поэтому мне нужно определить постоянный путь при использовании require в TEMPLATEURL, я не могу использовать свою константу - person Saad; 03.08.2016