Question

我正在使用角度ui-bootstrap。看看ui-bootstrap-tpls.js文件，我看到了这个片段

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

注意：templateUrl：＆＃39; template / accordion / accordion.html＆＃39;。

这个文件在哪里？我的电脑无处可寻？我假设它从远程位置调用它，如果是这样，我如何获得它本地，所以我可以在它上面工作？这里更大的问题是如何访问ui-bootstrap内置指令，以便我可以根据自己的喜好修改它们？

Answer 1

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

第一次使用模板时，会将其加载到模板缓存中以便快速检索。您可以直接将模板加载到     缓存在脚本标记中，或通过使用$ templateCache服务     直接


通过脚本标记添加：


这是   模板的内容
注意：脚本标签包含   模板不需要包含在文档的头部，   但它必须是$ 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文件

1 个答案: