AngularJS指令templateUrl

Question

I am challenged to AngularJS that but does not work occurred. 我向AngularJS挑战，但没有成功。 I've created a code that uses the directive. 我创建了使用指令的代码。 However, when you use the templateUrl, it does not do what we want to do the operation. 但是，当您使用templateUrl时，它不会执行我们想要执行的操作。 In my code, I am assuming that the tag is replaced by the contents of header.html. 在我的代码中，我假设该标签由header.html的内容替换。 However, you can not. 但是，您不能。 Please lend your wisdom. 请发挥你的智慧。

sample.html sample.html

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.min.js"></script>
<script type="text/javascript">
var directiveApp = angular.module('dApp', []);
directiveApp.directive('header', [function () {
    return {
        restrict: 'E',
        templateUrl: "header.html",
    };
}]);
</script>

<body ng-app="dApp">
    <header></header>
</body>

header.html header.html

<label>Hello!</label>

Answer 1

With templateUrl in directive, angular will send a http request to retrieve this html from you server side. 使用templateUrl指令时，angular将发送一个http请求以从服务器端检索此html。 So you should make sure there is such 'header.html' file in the correct url. 因此，您应该确保在正确的网址中有此类“ header.html”文件。

However, if you don't want to load this template with a ajax. 但是，如果您不想使用ajax加载此模板。 Then you can use the template in angular. 然后，您可以使用有角度的模板。

Add this to your sample.html: 将此添加到您的sample.html：

<script type="text/ng-template" id="header.html">
    <label>Hello!</label>
</script>

Hope this work for you. 希望这项工作对您有用。

AngularJS指令templateUrl

问题描述

1 个解决方案

解决方案1
0 2014-11-04 03:16:08

AngularJS指令templateUrl

问题描述

1 个解决方案

解决方案1 0 2014-11-04 03:16:08

解决方案1
0 2014-11-04 03:16:08