gpt4 book ai didi

javascript - 使用 Dustjs 进行 Angular 模板化

转载 作者:行者123 更新时间:2023-11-30 17:28:16 25 4
gpt4 key购买 nike

我是 AngularJS 环境的初学者。为了我公司的利益,我想将 Angular 框架的强大功能与 Dustjs 模板引擎结合起来。

问题是:Dustsjs 正在将文件编译为 .js 文件(我有一个 Grunt task 在我的公用文件夹中为我做这件事),而不是在 .html 中。而且,在 $routeProvider 的文档中,“templateUrl”或“template”参数正在寻找 .html 模板。

我的 app.js :

var app = angular.module('myApp', []);

app.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/', {
template: 'views/myView.js',
controller: 'HomeController'
});
}]);


正如您想象的那样,我得到了一个奇怪的结果,因为我的 .js 是在没有被解析的情况下注入(inject)的。 http://i.stack.imgur.com/5JkRx.jpg

所以,我的两个问题是:
- 我将 .js 文件路径放在 routeProvider 的模板中是否正确,或者是否有另一种方法来获取并正确显示 View ?简而言之,我做错了什么?
- 是否有结合这两种技术的最佳实践?

最佳答案

  • Am I doing it right to put the .js file path inside the template of routeProvider, or is there another way to get and correctly display the view? In short, what did I do wrong?

不,您放置的 .js 文件路径不正确。 Angular 期望它是一个 HTML 标记。

template: '<div>content</div>',

templateUrl : 'views/myview.html'

将是可接受的值。

  • Are there any best practices for combining these two technologies?

其中一种方法是使用 dust 模板作为外部模板,并让 angular routeProvider 负责渲染动态内容以供 angular 解析。例如,

家.尘

<html>
<head>
<title>{page_title}</title>
</head>
<body ng-app="myApp">
{>header/}
<div ng-view></div>
{>footer/}
</body>
</html>

header.dust

<div id="menu">Menu</div>

footer.dust

<div id="copyright">Footer</div>

查看/myView.html

<div id="content">Hi ((username))</div>

应用程序.js

var app = angular.module('myApp', []);

app.config(['$routeProvider', '$interpolateProvider', function ($routeProvider, $interpolateProvider) {
//This is required as dust templates also '{' and '}' for interpolation
$interpolateProvider.startSymbol('((').endSymbol('))');
$routeProvider.when('/', {
templateUrl: 'views/myView.html',
controller: 'HomeController'
});
}])
.controller('HomeController', function($scope){
$scope.username = "John Doe";
});

关于javascript - 使用 Dustjs 进行 Angular 模板化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23790057/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com