gpt4 book ai didi

dart - angular-dart 有没有办法明确通知修改模型的 View ?

转载 作者:行者123 更新时间:2023-12-03 03:47:10 25 4
gpt4 key购买 nike

我有一个使用 @NgController 的应用程序以及 UI 操作触发模型更改的工作用例,这些更改会立即反射(reflect)在 View 中。该模型由对象列表组成。

什么不工作是当触发的 Action 开始一些最终修改模型的异步过程(在列表中添加新元素)时。 View 没有更新。

我想这可以按设计工作,但我遗漏了一些东西。在这种情况下我应该使用什么模式?

更新:这是显示问题的最小代码片段:

<html ng-app>
<head>
<meta charset="utf-8">
<title>Angular bug test</title>
<link rel="stylesheet" href="angular_bug_test.css">
<script src="http://lounge-server.jit.su/socket.io/socket.io.js"></script>
</head>
<body test>
<h1>Angular bug test</h1>

<p>The number of element in the list is {{controller.list.length}}</p>
<input ng-click="controller.addElementSync()" type="button" value="Add Sync"></input>
<input ng-click="controller.addElementAsync()" type="button" value="Add Async"></input>
<input ng-click="controller.addElementJsAsync()" type="button" value="Add JS Async"></input>
<ul>
<li ng-repeat="element in controller.list">{{element}}</li>
</ul>

<script type="application/dart" src="angular_bug_test.dart"></script>
<script src="packages/browser/dart.js"></script>
</body>
</html>

和相应的 Dart 代码:
@NgController(selector: '[test]', publishAs: 'controller')
class TestController {

List<String> list = new List<String>();

void addElementSync() {
list.add("${list.length}. element");
}

void addElementAsync() {
new Timer(new Duration(seconds: 1), () => list.add("${list.length}. element"));
}

void addElementJsAsync() {
context['io']
.callMethod('connect', ['http://lounge-server.jit.su:80/'])
.callMethod('on', ['connect', _onConnect]);
}

void _onConnect() {
Logger.root.fine('connected');
list.add("${list.length}. connected");
Logger.root.fine('list.length = ${list.length}');
}

}

当触发 Add JS Async按钮控制台显示以下内容:
FINE : connected
FINE : list.length = 6

不幸的是, ng-repeat也不是 {{controller.list.length}}得到更新。

更新:以下解决方法在 JS 互操作中解决了此问题(对 James 表示敬意)

NgZone _zone;

TestController(NgZone this._zone);

无效 addElementJsAsync2() {
上下文['io']
.callMethod('connect', ['http://lounge-server.jit.su:80/'])
.callMethod('on', ['connect', _zone.run(_onConnect)]);
}


更新:该错误仍然存​​在于 0.11.0 和 NgZone已更名 VmTurnZone

最佳答案

您所描述的内容应该是开箱即用的。唯一棘手的部分是处理列表:为了检测列表中的变化,自定义指令必须使用 Scope.$watchCollection观看收藏。普通 watch 和属性图会错过列表中的更改。

处理列表的内置指令(例如 ng-repeat )已经使用 $watchCollection .

关于dart - angular-dart 有没有办法明确通知修改模型的 View ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21469361/

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