如何更新ObservableMap中對象屬性更改的視圖？

Question

我有一個可觀察的地圖，它將任意對象（比如另一個地圖）映射到它們的id。當我對這些對象進行更改時，對象也應在視圖中更新。但是，我沒有得到它的工作。這裏是我的設置至今：

myexample.html

<polymer-element name="my-example"> 
    <script type="application/dart" src="myexample.dart"></script> 
    <template> 
    <style></style> 
    <div> 
    <ul> 
     <template repeat="{{ entry in map.values }}"> 
      <li>{{ entry }}</li> 
     </template> 
    </ul> 
    <button on-click="{{change}}">Change</button> 
    </div> 
    </template> 
</polymer-element> 

myexample.dart

@CustomTag('my-example') 
class MyExample extends PolymerElement { 
    @observable Map<int, String> map = toObservable({'123': {'name': 'XYZ', 'size': 12}}); 

    MyExample.created() : super.created() { 
    map.changes.listen((_) => notifyPropertyChange(#map, 1, 0)); 
    } 

    void change() { 
    var object = map['123'] 
    object['size'] = 100; 
    map.notifyChange(new MapChangeRecord('123', null, object)); 
    } 
} 

在點擊 'Change'-按鈕，與ID的對象' 123 '在地圖中更新，但未在視圖中更新。有沒有人有想法，如何對視圖進行更改？

Answer 1

<link rel="import" href="../../packages/polymer/polymer.html"> 

<polymer-element name="app-element"> 
    <template> 

    <div> 
     <ul> 
     <template repeat="{{ entry in map.values }}"> 
      <li>x{{ entry['name'] }} {{ entry['size']}}</li> 
      <template repeat="{{ item in entry.values}}"> 
      y{{item}} 
      </template> 
     </template> 
     </ul> 
     <button on-click="{{change}}">Change</button> 
    </div> 
    </template> 
    <script type="application/dart" src="app_element.dart"></script> 
</polymer-element> 

進口 '包：聚合物/ polymer.dart';

@CustomTag('app-element') 
class AppElement extends PolymerElement { 

    @observable 
    Map map = toObservable({'123': {'name': 'XYZ', 'size': 12}}); 

    AppElement.created() : super.created(); 

    void change() { 
    var object = map['123']['size'] = 100; 
    } 
}