个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
27
4
要么是我的代码出问题了，要么是我犯了一个错误:
我有一个 json 提要:
{
"sections": [
{
"identifier": "header",
"blocks": [
{
"identifier": "onebyone",
"html": "<h1>API</h1>"
},
{
"identifier": "onebyone",
"html": "<h1>API</h1>"
}
]
},
{
"identifier": "content",
"blocks": []
},
{
"identifier": "footer",
"blocks": []
}
]
}
我在 AngularJS Controller 中进行调用，对各部分进行排序并尝试连接 html block ，因此:
cmsApp.controller('cmsPageCtrl', function($scope, $http, $templateCache, $sce) {
$http.get("/api.php/api/page/home")
.success(
function(response) {
$scope.sections = [];
response.sections.forEach(function(el, idx, arr) {
var id = el.identifier;
$scope.sections[id] = el;
//$scope.sections[id].template = "<h1>HOI</h1>";
$scope.sections[id].template = 'header.html';
var template = "TEST";
el.blocks.forEach(function(el, idx, arr) {
var partial = el.html;
template = template + partial;
});
template = template + "<div><b>b</b>TEST1</div>";
console.log(id);
console.log(template);
$scope.sections[id].template = 'header.html';
$templateCache.put('header.html', $sce.trustAsHtml(template));
console.log(template);
});
}
);
});
现在人们会期望以下输出:
<body ng-app="cmsApp" ng-controller="cmsPageCtrl">
<ng-include src="sections.header.template"></ng-include>
</body>
成为: TEST<h1>API</h1><h1>API</h1><div><b>b</b>TEST1</div>
结果是: <span class="ng-scope">TEST</span><div class="ng-scope"><b>b</b>TEST1</div>
控制台输出为:
cms.ctrl.js (line 33) TEST<h1>API</h1><h1>API</h1><div><b>b</b>TEST1</div>
cms.ctrl.js (line 34) TEST<h1>API</h1><h1>API</h1><div><b>b</b>TEST1</div>
cms.ctrl.js (line 39) content
cms.ctrl.js (line 33) TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 34) TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 39) footer
cms.ctrl.js (line 33) TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 34) TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 39)
什么负责剥离 header 部分输出中的 HTML？
最佳答案
Angular 默认这样做是为了防止注入(inject)。如果您确实想这样做，则需要包含 ng-sanitize插件，然后将模块添加到您的应用程序中:
angular.module('myApp', ['ngSanitize']);
然后使用 ng-bind-html 指令绑定(bind)您的 html 内容。
ng-bind-html="myHTML"
关于javascript - $templateCache 中的 AngularJS 动态部分被剥离，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32144308/
27
4
0
我有两个 html 页面，snippet1.html & snippet2.html .我想在我的指令中使用它们。因为我要使用单个指令添加多个模板。 我通过在 中添加 html 模板来尝试这个东西标
我想查看$templateCache的内容通过从 devtool 的控制台访问它。 我尝试了以下给出的解决方案:https://stackoverflow.com/a/24711132 . 这对我不起
我一直在从 $templateCache 加载模板时遇到问题。 我如何将模板放入 $templateCache : var app = angular.module('anglober', ['ang
我正在尝试在 AngularStrap 弹出窗口中加载模板文件，但是我在使用 $templateCache 时遇到问题。我似乎比其他问题退了一步，因此这看起来是双重的。 根据 API 文档，我添加了
我正在尝试在 AngularStrap 弹出窗口中加载模板文件，但是我在使用 $templateCache 时遇到问题。我似乎比其他问题退了一步，因此这看起来是双重的。 根据 API 文档，我添加了
我对 $templateCache 资源有点困惑； html/template 会存储在服务器端吗？ 或者将存储在浏览器内存中？如果是这样，内存限制是多少？ 最佳答案 $templateCache 是
我不想延迟加载我的路线模板。相反，我想在执行任何路由之前将所有路由模板加载到 $templateCache 中。 这就是我正在做的事情: angular.module('myApp', ['ngRou
我正在使用 gulp-angular-templatecache用我所有的模板创建一个模块。这工作正常，我得到一个这样的模块: angular.module("starter.templates").
在分析大型 AngularJS 应用程序时，我开始跟踪 $templateCache。 https://docs.angularjs.org/api/ng/service/ $模板缓存 这个对象是什么
能否在保持对原始提供者的引用的同时覆盖像 $templateCache 这样的核心提供者？我想覆盖 $templateCache 以区分大小写。 即像 var normalGet = $templat
我有 $http.get 所有的 html 模板到 $TemplateCache 中，我的问题是我的指令使用起来是否更有效 TemplateUrl : abc.html 或者 Template : $
我正在使用 gulp-angular-templatecache生成一个 templateCache.js 文件，它将我所有的 HTML 模板文件合并为 1。(my full gulpfile) 将该
要么是我的代码出问题了，要么是我犯了一个错误: 我有一个 json 提要: { "sections": [ { "identifier": "header", "b
当我的 Angular Controller 初始化时，我需要缓存一些 HTML 文件。 根据 Angular $templateCache documentation我可以使用以下命令将 HTML
我试图在列表中显示项目的详细信息。这应该通过延迟加载模板(DOM 的细节)来完成，因为模板非常大，列表中有很多项目，所以带有 ng-include 的 ng-show 不起作用，因为它被编译成DOM
我已经阅读了 $templateCache 的文档，但我仍在努力理解如何使用 put 函数将远程模板加载到缓存中。 下面是一个例子: onBoardingApp.run(function ($temp
目前正在处理一个大的 html 文件(7k+ 行代码)。我必须重构整个事情。以前负责代码的人使用下面介绍的方法将特定模板加载到缓存中，以便通过 ng-include 使用。 Example
我目前正在构建一个 Angular 应用程序，它需要通过脚本标记嵌入到任何其他网页上。 在使用 resumeBootStrap 初始化应用程序之前，我决定使用一些 JS 构建应用程序包装器、ng-vi
我想在不同的 js 库之间共享缓存的模板字符串，并且需要为 Angular 应用程序调用 $templateCache.get("TEMPLATE.HTML")。Angular 应用程序在公共(pub
我使用 Angular 模板缓存。按照存在的代码删除应用程序模块中的模板缓存，但我需要在开发机器上使用 gulp 删除所有 templateCache。 myApp.run(function($roo
我是一名优秀的程序员,十分优秀！