ui-bootstrap-tpls.js 中的 templateurl 文件

Question

我正在与 angular ui-bootstrap 合作。仔细查看 ui-bootstrap-tpls.js 文件，我看到了这个片段

.directive('accordion', function () {
  return {
    restrict:'EA',
    controller:'AccordionController',
    transclude: true,
    replace: false,
    templateUrl: 'template/accordion/accordion.html'
  };
})

注意：templateUrl：'template/accordion/accordion.html'.

这个文件在哪里？？在我的电脑上找不到它？我假设它是从远程位置调用它的，如果是这样，我如何在本地获取它以便我可以处理它？这里更大的问题是如何在指令中访问 ui-bootstrap built 以便我可以根据自己的喜好修改它们？

Answer 1

该文件来自 $templateCache。来自 Angular 文档：

The first time a template is used, it is loaded in the template cache for quick retrieval. You can load templates directly into the cache in a script tag, or by consuming the $templateCache service directly.

通过脚本标签添加：

这是模板内容
注意：脚本标签包含模板不需要包含在文档的头部，但它必须是 $rootElement 的后代（IE，元素 ng-app 属性），否则模板将被忽略。

这是一个例子：

angular.module('template/components/login.tpl.html', [])
    .run(['$templateCache', function($templateCache){
        $templateCache.put('template/components/login.tpl.html',
            '<div class="row">' +
                '<div class="col-md-4 col-md-offset-5 col-xs-12 col-xs-offset-2">' +
                    '<div>' +
                        '<label for="email">Email:</label>' +
                        '<input type="email" id="email" ng-model="user.username" class="required" name="email" autofocus />' +
                    '</div>' +
                    '<div>' +
                        '<label for="pwd">Password:</label>' +
                        '<input type="password" id="pwd" class="required" ng-model="user.password" name="pwd"/>' +
                    '</div>' +
                    '<p>' +
                        '<button id="login" class="btn btn-default" ng-click="onSubmit(user)">Login</button>' +
                    '</p>' +
                '</div>' +
            '</div>');
    }]);

我会引用 'template/components/login.tpl.html' 作为我的 templateUrl

ui-bootstrap-tpls.js 中的 templateurl 文件

templateurl file in ui-bootstrap-tpls.js

angularjs

angular-ui-bootstrap