在AngularJS中使用内联模板
我想加载一个内联视图模板。
我将模板包装在类型为的脚本标签中text/ng-template，并将ID设置为temp1.html。这是我的模块配置
learningApp.config(function ($routeProvider) {
$routeProvider
.when("/first",{ controller: "SimpleController", templateUrl: "temp1.html"})
.when("/second", {controller: "SimpleController", templateUrl: "temp2.html"})
.otherwise({redirectTo : "/first"});
});
它GET http://localhost:41685/temp1.html 404 (Not Found)在控制台窗口中告诉我，这意味着它正在寻找该名称的文件。
我的问题是：如何配置路由以使用嵌入式模板？
更新：这是我的服务器渲染的DOM的样子
<!DOCTYPE html>
<html>
<head>
<script src="/Scripts/angular.js"></script>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
</head>
<body>
<div class="container">
<h2>Getting Started with Angular</h2>
<div class="row">
<div class="panel" ng-app="LearningApp">
<div ng-view></div>
</div>
</div>
<script type="text/ng-template" id="temp1.html">
<div class="view">
<h2>First View</h2>
<p>
Search:<input type="text" ng-model="filterText" />
</p>
<ul class="nav nav-pills">
<li ng-repeat="cust in customers | orderBy:'name' | filter: filterText "><a href="#">{{cust.name}} - {{cust.school}}</a></li>
</ul>
</div>
</script>
<script type="text/ng-template" id="temp2.html">
<div class="view">
<h2>Second View</h2>
<p>
Search:<input type="text" ng-model="filterText" />
</p>
<ul class="nav nav-pills">
<li ng-repeat="cust in customers | orderBy:'name' | filter: filterText "><a href= "#">{{cust.name}} - {{cust.school}}</a></li>
</ul>
</div>
</script>
</div>
<script src="/Scripts/jquery-1.9.1.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/app/LearningApp.js"></script>
</body>
</html>
问题答案：
Ody，您的方向正确，唯一的问题是标记位于使用指令的DOM元素 之外ng-app。如果将其移至<body ng- app="LearningApp">元素，则内联模板应该可以使用。
-
问题内容： 在AngularJS中，HTML模板中包含的任何内联javascript代码均不起作用。 例如： main.html文件： 和script.html文件： 当我打开主页时，我希望收到一条警告消息，说“是”，但没有任何反应。我认为AngularJS中的一些安全限制阻止了内联脚本，但是我找不到任何解决方法。 注意：我不使用jQuery或任何其他框架，仅使用AngularJS 1.2.7。
-
问题内容： 我正在与AngularJS一起显示应用程序键（应用程序标识符）表，我想使用编辑按钮在该表行中显示一个小表格。然后用户可以编辑字段并单击“保存”或“取消” 演示：http：//jsfiddle.net/Thw8n/ 我的内联表单效果很好。我单击编辑，然后出现一个表格。取消也很棒。 我的问题是 如何连接保存按钮和将对API进行$ http调用的函数 如何从该行获取数据以发送到$ http调
-
问题内容： 我只是在学习Angularjs，以及如何使用templateUrl加载模板。 我有一个简单的指令： 我尝试使用这样的指令： 打开页面后，出现以下异常： 我没有确定要跨域加载模板文件（te.html与default.html处于同一折叠）。 有人可以帮我弄清楚发生了什么吗？ 问题答案： 问题是您正在使用文件协议（使用协议）运行示例，并且许多浏览器（Chrome，Opera）在使用协议时都
-
问题内容： 我有三张桌子。 地点 学校 school_locations 此处的表位置包含应用程序的所有位置。学校的位置由ID调用。 当我使用查询 它显示“ coun”类型的名称 但我想显示location.name，其中只有school_locations的类型为“ coun” 我尝试了以下查询，但似乎都没有用 和 是否可以在查询中使用多个内部联接，还是有另一种方法？ 问题答案： 该子句必须在语
-
问题内容： 如何在Angular中使用Google GeoChart？我想在geoChart中注入角度数据，就像Javascript中的以下示例一样：https：//developers.google.com/chart/interactive/docs/gallery/geochart？hl = it＃Regions 一些忠告？ 问题答案： Angular Google Chart可以做到这一点
-
问题内容： 我真的对angularjs中的 $ compile 感到困惑。任何人都可以帮助我，在angularjs中使用$ compile以及在本文档之外的示例。 https://docs.angularjs.org/api/ng/service/$compile 问题答案： $ compile只是将文本编译为html。 这是示例示例