相對templateUrl

我有一個指令，看起來像這樣：相對templateUrl

angular.module('customDirectives', []) 
.directive('searchResult', function() { 
    return { 
     templateUrl: 'app/directives/templates/searchResult.html', 
     replace: true, 
     scope: { 
      itemObject: "=", 
      itemById: "&" 
     } 
    } 
});

它的工作原理，但我想有一個像「模板/ searchResult.html」一templateUrl因爲模板文件夾是正確的在我的指令文件旁邊。但似乎我需要給我的模板的位置取決於我的index.html文件在哪裏...有無論如何改變templateUrl爲「模板/ searchResult.html」？

來源

2016-01-18 Kévin Duguay

'app/directives/templates/searchResult.html'是一個相對路徑。如果這實際上是如何構建網站的，那麼您可以將模板文件夾移動到兩個節點上。 – errata

我的目標是路徑只是'templates/searchResult.html'，所以如果我需要我的指令在其他項目中，我可以複製/粘貼指令文件夾，而不必更改所有我的指令templateUrl。 –

請參閱https://stackoverflow.com/questions/21103724/angular-directive-templateurl-relative-to-js-file中建議的答案 - 它確實看起來有點冒失，但這是一個很好的解決方法。 – miqid

我想我有一個解決方法。如果您確定，您將在一個地方擁有所有指令，只需使用角常量來存儲根文件夾url。爲了做到這一點，首先添加一個常數您的應用程序模塊，例如：

angular.module('app', ['customDirectives']) 
    .constant('appConfig', { 
     directivesRoot: 'app/directives/' 
    });

然後，在你的指令，注入appConfig和使用它像這樣：

angular.module('customDirectives', []) 
.directive('searchResult', ['appConfig', function(appConfig) { 
    return { 
     templateUrl: appConfig.directivesRoot + 'templates/searchResult.html', 
     replace: true, 
     scope: { 
      itemObject: "=", 
      itemById: "&" 
     } 
    } 
}]);

如果你想要在另一個項目中使用指令，您只需更改指令Root URL。

來源

2016-01-19 00:32:56 PJDev

回答

相關問題