- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个简单的 Angular TabCtrl
加载不同的模板文件。我将模板文件本身包括在内:
<script type="text/ng-template" id="summary.tpl.html">
// Actual template elements
</script>
在 ng-app
内并且与 TabCtrl
在同一页面上。但是,模板不会在页面加载时或单击选项卡时加载。我几乎完全按照这个 JSFiddle ( http://jsfiddle.net/eRGT8/162/ )...我做错了什么?
如果我不发布更多代码你帮不了我,我会这样做。
编辑:更多代码
<!doctype html>
<html lang="en" ng-app="myApp">
<head>
</head>
<body>
<div id="wrapper">
<div id="sidebar-wrapper">
<div class="logo">
</div>
<ul class="sidebar-nav" ng-controller="TabsCtrl">
<li ng-repeat="tab in tabs"
ng-class="{active_tab:isActiveTab(tab.url)}"
ng-click="onClickTab(tab)">
<a href="#">
<div class="tab-icon">
<i ng-class="tab.icon"></i>
</div>
<div class="tab-label">{{tab.label}}</div>
</a>
</li>
</ul>
</div>
<div id="page-content-wrapper">
<div class="page-content">
<div class="dashboard" ng-include="activeTab"></div>
<script type="text/ng-template" id="summary.tpl.html">
HI
</script>
<script type="text/ng-template" id="downloads.tpl.html">
</script>
<script type="text/ng-template" id="ads.tpl.html">
</script>
<script type="text/ng-template" id="landing.tpl.html">
</script>
<script type="text/ng-template" id="retargeted.tpl.html">
</script>
</div>
</div>
</div>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-route.js"></script>
<script src="lib/ui-bootstrap.js"></script>
<script src="js/routes.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>
</body>
</html>
编辑: JS 文件
myApp.controller('TabsCtrl', ['$scope', function ($scope) {
$scope.tabs = [{
label: 'one',
icon: 'one',
url: 'summary.tpl.html'
}, {
label: 'two',
icon: 'two',
url: 'downloads.tpl.html'
}, {
label: 'three',
icon: 'three',
url: 'ads.tpl.html'
}, {
label: 'four',
icon: 'four',
url: 'landing.tpl.html'
}, {
label: 'five',
icon: 'five',
url: 'retargeted.tpl.html'
}];
$scope.activeTab = 'summary.tpl.html';
$scope.onClickTab = function(tab) {
$scope.activeTab = tab.url;
}
$scope.isActiveTab = function(tabUrl) {
return tabUrl == $scope.activeTab;
}
}]);
最佳答案
你的 ng-include="activeTab"
它在 TabsCtrl
的范围之外定义在 ng-controller="TabsCtrl"
.
尝试将其添加到 div id="wrapper"
.
<div id="wrapper" ng-controller="TabsCtrl">
元素
<div class="dashboard" ng-include="activeTab">
需要在 TabsCtrl 内部,然后它们才能相互通信。 https://docs.angularjs.org/guide/scope
另一种(但不是很推荐的方法)是将变量添加到 $rootScope 并将其传递给 Controller 。
例如:
myApp
.controller('TabsCtrl',
['$scope', '$rootScope', function ($scope, $rootScope) {...
$rootScope.activeTab = 'summary.tpl.html';
在这种情况下,activeTab
将在整个 ng-app="myApp"
中提供范围。
关于javascript - Angular 应用找不到 ng-template tpl.html 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24067208/
我有以下 TPL 数据流,当使用谓词过滤从 TransformBlock 传递到 ActionBlock 的项目时,它永远不会完成。 如果谓词对任何项目返回 false,则数据流挂起。 请有人提供一些
我是 smarty 的新手,所以我不确定这是否会导致我遗漏某些内容,但目前我正在尝试从 css 文件中提取一个类。 到目前为止,我已经设置了 2 个类 mainbackground 和 body,ma
如何强制 TPL 使用固定数量的线程?我知道 MaxDegreeOfParallelism 可用于设置上限,但我希望上限等于下限。这可能吗?怎么办? 因为我知道有人会问 =) 是的,我确定我想这样做,
我正在尝试使用 GXT 3.0 的 XTemplates(类似于 EXT),这里有 2 个具有以下关系的简单 java 对象: class A { String name; public
我刚刚将 Visual Studio 11 Beta 升级到新的 Visual Studio 2012 RC,并且在引用 TPL 数据流时遇到了问题。 首先,我尝试像以前一样通过从框架中添加引用来引用
我需要制作可扩展的流程。该进程主要有 I/O 操作和一些次要的 CPU 操作(主要是反序列化字符串)。该过程在数据库中查询 url 列表,然后从这些 url 中获取数据,将下载的数据反序列化为对象,然
我们有一个 TPL 数据流管道,其中包含以下 block : 变换 block A:Http post call 转换 block B:数据库 IO Transform Block C:一些单位转换数
我有一个 BufferBlock 来发布消息: public class DelimitedFileBlock : ISourceBlock { private ISourceBlock _s
我想在 Windows Azure 上的工作进程中使用 TPL。我希望在队列中添加一个 IJob,它有一个 Run 方法,因此工作线程将包括: 循环 将项目从队列中取出 使用TPL调用IJob.Run
我尝试创 build 计良好的 TPL 数据流管道,以优化系统资源的使用。我的项目是一个 HTML 解析器,它将解析后的值添加到 SQL Server DB 中。我已经有了 future 管道的所有方
我想为特定的内容类型覆盖 page.tpl.php。 我已经尝试过这些东西,对我没有任何作用。 page--article.tpl.php page--node--article.tpl.php pa
我已经完成了这个 POC 并验证了当你创建 4 个线程并在四核机器上运行它们时,所有的核心都会变得忙碌——所以,CLR 已经在不同的核心上有效地调度了线程,那么为什么要使用 TASK 类呢? 我同意
使用Visual Studio Concurrency Visualizer我现在明白为什么切换到 Parallel.For 没有任何好处:只有 9% 的时间机器忙于执行代码,其余的时间为 71% 的
我的代码中有以下使用 TPL 的设置: 我的类中的一个字段:private CancellationTokenSource _cancellationTokenSource; 每次我创建使用特定取消
我有一个 Windows 服务,它在经过漫长的过程后发送电子邮件。每当有表条目并处理它并将其发送出去时,该服务就会继续从数据库表中获取电子邮件数据。 目前它是一个多线程应用程序,我们在生产服务器中将线
刚刚使用 TPL DataFlow 编写了示例生产者消费者模式。我在这里有一些基本问题。 只有在生产者发布所有项目后,消费者才处于事件状态。异步是指生产任务和消费任务都可以并行运行。 给消费者一个 s
我正在使用 TPL,需要有一个长时间运行的 TPL 任务将结果发送到父 UI 线程而不终止。我已经尝试了几种方法,并且已经在谷歌上搜索了很多。有谁知道如何通过 TPL 实现这一点? 最佳答案 您可以传
我有一个以这种方式设置的 TPL 数据流: 下载字节数组 处理数据 将处理后的数据流式传输到另一个位置 此流程运行良好,但偶尔会在下载文件时遇到备份、连接问题等。我想做的是并行下载,但仍确保执行第 3
我有一个应该批量调用并压缩大文件的控制台应用程序,我想使用 DataFlow,除了完成之外一切正常 请考虑以下代码 public static void CompressFiles(string fo
当你生成多个任务时,像这样: for (int i = 0; i ((stateObject) => { tls.Value = (int)stateObject;
我是一名优秀的程序员,十分优秀!