0

我试图让 angularjs 与覆盖引导程序的本地模板很好地配合。我最初使用相同的文件路径（例如 uib/template/carousel/carousel.html），这在发布时很好，但在本地它不起作用。

所以，我发现了这个解决方案： Angular ui bootstrap directive template missing

他们说您可以使用$provide服务使用新网址覆盖模板。所以我这样做了：

'use strict';

angular.module('core').config(coreConfig);

function coreConfig($provide) {
    $provide.decorator('uibCarousel', function ($delegate) {
        console.log($delegate[0]);
        $delegate[0].templateUrl = 'bootstrap/carousel/carousel.html';
        return $delegate;
    });
};

这应该工作。我的核心模块如下所示：

'use strict';

angular.module('core', [
    'ngCookies',
    'ngNotify',
    'ngResource',
    'ngSimpleCache',
    'ui.bootstrap',
    'ui.bootstrap.tpls',
    'ui.router', 
    'ui.select',

    // -- remove for brevity -- //
]);

正如你所看到的，我已经ui.bootstrap.tpls加载了模块，所以理论上我的代码应该可以工作。谁能想到它不会的原因？

4

1 回答 1

1

Sorry for all the comment spam. I think I have found the answer to your issue. You must append Directive to a directive when defining the decorator:

function coreConfig($provide) {
    $provide.decorator('uibCarouselDirective', function ($delegate) {
        console.log($delegate[0]);
        $delegate[0].templateUrl = 'bootstrap/carousel/carousel.html';
        return $delegate;
    });
};

From the docs:

Decorators have different rules for different services. This is because services are registered in different ways. Services are selected by name, however filters and directives are selected by appending "Filter" or "Directive" to the end of the name. The $delegate provided is dictated by the type of service.

https://docs.angularjs.org/guide/decorators

This is an example from my own (working) code:

$provide.decorator("uibDatepickerPopupDirective", [
  "$delegate",
  function($delegate) {
    var directive = $delegate[0];
    // removed for brevity
    return $delegate;
   }
 ]);
于 2018-07-06T14:29:49.493 回答