比如说,我正在尝试将一个电子邮件“模板”作为用户的“预览”引入到AngularJS应用程序中的iframe中。该iframe位于控制器区域内(我们称之为MainCtrl)。然后,用户可以使用MainCtrl提供的表单元素根据其输入更新预览。例如,假设我们引入到iframe中的模板看起来像这样:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<style type="text/css">
.some {styles: here};
</style>
</head>
<body>
<h1>{{header}}</h1>
<p>{{body}}</p>
</body>
</html>
在我们的index.html文件中(AngularJS应用程序),我们会有绑定到{{header}}和{{body}}的表单元素...
<div ng-controller="MainCtrl">
<input type="text" ng-model="header" placeholder="header text" />
<input type="text" ng-model="body" placeholder="body text" />
<iframe src="template.html" width="800" height="1500"></iframe>
</div>
这是否可能?AngularJS能否更新这些信息,如果可以,应该如何更新?我有类似的设置,但似乎无法正常工作。我无法使AngularJS表达式计算...只有{{body}}等内容显示出来...