问题
An event handler in Polymer element a
should change an attribute in Polymer element b
.
I tried (within a.dart
):
- imported b.dart
- query selector for element b
.
- called the function which modifies the value.
- the value changes(print)). but not updated on UI.
- modified variable is observable
a.html
<template>
<input type="image" src="button_minus_red.gif" on-click="{{removePlayer}}" width = "15" height ="15">
{{playerName}}:{{playerCost}}<br>
</template>
b.html
<template>
<h1>Team Size:{{playerCount}}</h1>
<h1>Team Value</h1>
<br>
</template>
b.dart
@CustomTag('team-item')
class TeamItem extends PolymerElement{
@observable int playerCount =0;
void reduceCount(){
playerCount -= 1;
print("PLayerCount");
print(playerCount);
}
TeamItem.created(): super.created();
}
a.dart
@CustomTag('player-item')
class PlayerItem extends PolymerElement{
@observable String playerName;
@observable String playerCost;
void removePlayer() {
print('dispatching from child');
querySelector("#playerCounts").reduceCount();
remove();
}PlayerItem.created(): super.created();
}
回答1:
This way you only search the children of a
.
If you want to search the whole page you need to
import 'dart:html' as dom;
...
(dom.querySelector('* /deep/ #playerCounts')
as TeamPlayer).reduceCount();
来源:https://stackoverflow.com/questions/29593782/event-in-one-polymer-to-change-attributes-of-another-polymer-them-not-having-pa