我有一个包含简单组件的页面:
<!DOCTYPE html>
<html ng-app>
<head>
<title>Test</title>
</head>
<body index-page>
<div>
<h1>Status</h1>
<h2>{{ 1 | enum }}</h2>
</div>
<script type="text/javascript" src="packages/web_components/platform.js"></script>
<script type="text/javascript" src="packages/web_components/dart_support.js"></script>
<script type="application/dart" src="index.dart"></script>
<script type="text/javascript" src="packages/browser/dart.js"></script>
</body>
</html>
过滤器&#39; enum&#39;使用加载使用XHR的数据。因此,在页面加载时,数据可用(例如,它需要一秒钟)。因此,虽然数据不存在,但过滤器返回null。当收到数据并且过滤器能够返回有意义的值时,如何触发控制器重新评估模板?
在下面的示例中,我使用Timer来模拟XHR:
import 'dart:html';
import 'dart:convert';
import 'dart:async';
import 'package:angular/application_factory.dart';
import 'package:angular/angular.dart';
@Controller(selector: '[index-page]', publishAs: 'ctrl')
class IndexPageController {
}
const DELAY = true;
@Formatter(name: 'enum')
class EnumNameFormatter {
Map names = new Map();
EnumNameFormatter() {
if (DELAY) {
new Timer(new Duration(milliseconds:2000), fillNames);
} else {
fillNames();
}
}
void fillNames() {
names[1] = "One";
names[2] = "Two";
names[3] = "Three";
}
String call(enumValue) {
var enumName = names[enumValue];
if (enumName != null) {
return enumName;
}
}
}
class MyAppModule extends Module {
MyAppModule() {
// needed for https://github.com/angular/angular.dart/issues/1272
// this will be fixed in 14.0
Binding.printInjectWarning = false;
// Main controller
bind(IndexPageController);
// Formatter
bind(EnumNameFormatter);
}
}
void main() {
applicationFactory().addModule(new MyAppModule()).run();
}
在下面的示例中,如果我设置DELAY = true - &#34; One&#34;没有显示在页面上。如果我设置DELAY = false - 一切正常(应该如此)。当XHR(计时器)完成时,如何强制页面刷新/重新渲染?
答案 0 :(得分:3)
在AngularDart中,您不再需要使用$ apply或$ digest来重新呈现页面。我们使用Dart Zones在任何操作后自动脏检模型。
您所看到的是一个不同的错误/功能 - @Formatters
是幂等的。也就是说,我们假设如果我们将值格式化一次,再次格式化它将产生相同的结果。
由于格式化的表达式:1
没有改变,我们不会重新运行格式化程序,因为我们假设它会给出相同的值。
简单的解决方法是使用函数而不是格式化程序。