在dart polymer 1.x中设置隐藏属性_Dart_Dart Polymer

在dart polymer 1.x中设置隐藏属性

dart

在dart polymer 1.x中设置隐藏属性,dart,dart-polymer,Dart,Dart Polymer,当在国家/地区下拉菜单中选择美国时，我尝试切换（隐藏/取消隐藏>状态下拉菜单） .html 应用程序正常显示，但当我选择“美利坚合众国”时，状态组合不会显示。如果选择了美国以外的任何国家，我还想隐藏状态组合非常感谢您的帮助。该$的位置错误 hidden$="[[hideState]]" 实际的hidden属性由Polymer设置。这是为了解决元素的href等属性的问题，其中绑定表达式（不是图像的实际URI的字符串）会在Polymer有机会解析绑定表达式之前生成错误消息还有一些问题（请参

当在国家/地区下拉菜单中选择美国时，我尝试切换（隐藏/取消隐藏>状态下拉菜单）

.html 应用程序正常显示，但当我选择“美利坚合众国”时，状态组合不会显示。如果选择了美国以外的任何国家，我还想隐藏状态组合

非常感谢您的帮助。

该

的位置错误

  hidden$="[[hideState]]"

实际的

hidden

属性由Polymer设置。这是为了解决

元素的

href

等属性的问题，其中绑定表达式（不是图像的实际URI的字符串）会在Polymer有机会解析绑定表达式之前生成错误消息

还有一些问题（请参见代码中的注释）

飞镖

@HtmlImport('app_element.html')
library so33931432_hide_paper_dropdown.web.app_element;

import 'package:web_components/web_components.dart' show HtmlImport;
import 'package:polymer/polymer.dart';
import 'package:polymer_elements/paper_dropdown_menu.dart';
import 'package:polymer_elements/paper_menu.dart';

/// [PaperDropdownMenu], [PaperMenu]
@PolymerRegister('app-element')
class AppElement extends PolymerElement {
  AppElement.created() : super.created();

  @property
  List<String> countries = ['Austria', 'Belgium', 'Czech Republic', 'United States of America'];
  @property
  bool hideState; // = true; // you could set a default value, then you don't need ready

  // This way usually works better for me than @Listen
  @Property(observer: 'toggleStateOnUSASelection')
  String countrySelectedItemLabel = '';

  // If `@Property(observer: ...) is used the function signature 
  // has to be changed
  @reflectable
  void toggleStateOnUSASelection(String label, [_]) {
    switch (countrySelectedItemLabel) {
      // I wasn't sure what you actually tried to accomplish here
      // but this worked for me to reproduce your problem
      case 'United States of America':
        set('hideState', false);
        break;
      default:
        set('hideState', true);
    }
  }

  void ready() {
    set('hideState', true);
  }
}

@HtmlImport（'app\u element.html'））
库so33931432_hide_paper_dropdown.web.app_元素；
导入“package:web\u components/web\u components.dart”显示HtmlImport；
进口“包装：聚合物/聚合物.dart”；
导入“包装：聚合物元素/纸张下拉菜单.省道”；
导入“包装：聚合物元素/纸张菜单.省道”；
///[纸张下拉菜单]，[纸张菜单]
@聚合注册器（'app-element'）
类AppElement扩展了聚合关系{
AppElement.created（）：super.created（）；
@财产
名单国家=[‘奥地利’、‘比利时’、‘捷克共和国’、‘美利坚合众国’]；
@财产
bool hideState；//=true；//您可以设置一个默认值，这样就不需要准备就绪
//这种方式通常比“听”更适合我
@属性（观察者：“ToggleStateonSasselection”）
字符串countrySelectedItemLabel=''；
//如果使用了`@属性（观察者：…）函数签名
//必须改变
@可反射
void togglestateonusasselection（字符串标签，[\u]）{
开关（国家/地区选择编辑标签）{
//我不确定你到底想在这里完成什么
//但这让我重现了你的问题
“美利坚合众国”案：
set（'hidstate'，false）；
打破
违约：
设置（'hidstate'，true）；
}
}
void ready（）{
设置（'hidstate'，true）；
}
}

html

<!DOCTYPE html>
<dom-module id='app-element'>
  <template>
    <paper-dropdown-menu
        label="Country *"
        selected-item-label="{{countrySelectedItemLabel}}"
        error-message="Country is required"
        id="countryDdm">
      <paper-menu class="dropdown-content">
        <template
            is="dom-repeat"
            items="[[countries]]"
            as="country">
          <div label="[[country]]">[[country]]</div>
        </template>
      </paper-menu>
    </paper-dropdown-menu>
    <div>selectedItem:<span>[[countrySelectedItemLabel]]</span> value: <span>[[countrySelectedItemLabel]]</span></div>
    <div>hideState: <span>[[hideState]]</span></div>
    <div class="layout horizontal">
      <paper-dropdown-menu
          hidden$="[[hideState]]"
          label="State *"
          selected-item-label="{{stateSelectedItemLabel}}"
          id="stateDdm">
        <paper-menu class="dropdown-content">
          <template
              is="dom-repeat"
              items="[[states]]"
              as="state">
            <div>[[state.name]]</div>
            <br>
          </template>
        </paper-menu>
      </paper-dropdown-menu>
    </div> <!-- missing in your question -->
  </template>
</dom-module>


[[国家]]
selectedItem:[[countrySelectedItemLabel]]值：[[countrySelectedItemLabel]]
hideState:[[hideState]]
[[state.name]]


该$
位于错误位置
  hidden$="[[hideState]]"

实际的hidden
属性由Polymer设置。这是为了解决
元素的href
等属性的问题，其中绑定表达式（不是图像的实际URI的字符串）会在Polymer有机会解析绑定表达式之前生成错误消息
还有一些问题（请参见代码中的注释）
飞镖
@HtmlImport('app_element.html')
library so33931432_hide_paper_dropdown.web.app_element;

import 'package:web_components/web_components.dart' show HtmlImport;
import 'package:polymer/polymer.dart';
import 'package:polymer_elements/paper_dropdown_menu.dart';
import 'package:polymer_elements/paper_menu.dart';

/// [PaperDropdownMenu], [PaperMenu]
@PolymerRegister('app-element')
class AppElement extends PolymerElement {
  AppElement.created() : super.created();

  @property
  List<String> countries = ['Austria', 'Belgium', 'Czech Republic', 'United States of America'];
  @property
  bool hideState; // = true; // you could set a default value, then you don't need ready

  // This way usually works better for me than @Listen
  @Property(observer: 'toggleStateOnUSASelection')
  String countrySelectedItemLabel = '';

  // If `@Property(observer: ...) is used the function signature 
  // has to be changed
  @reflectable
  void toggleStateOnUSASelection(String label, [_]) {
    switch (countrySelectedItemLabel) {
      // I wasn't sure what you actually tried to accomplish here
      // but this worked for me to reproduce your problem
      case 'United States of America':
        set('hideState', false);
        break;
      default:
        set('hideState', true);
    }
  }

  void ready() {
    set('hideState', true);
  }
}

@HtmlImport（'app\u element.html'））
库so33931432_hide_paper_dropdown.web.app_元素；
导入“package:web\u components/web\u components.dart”显示HtmlImport；
进口“包装：聚合物/聚合物.dart”；
导入“包装：聚合物元素/纸张下拉菜单.省道”；
导入“包装：聚合物元素/纸张菜单.省道”；
///[纸张下拉菜单]，[纸张菜单]
@聚合注册器（'app-element'）
类AppElement扩展了聚合关系{
AppElement.created（）：super.created（）；
@财产
名单国家=[‘奥地利’、‘比利时’、‘捷克共和国’、‘美利坚合众国’]；
@财产
bool hideState；//=true；//您可以设置一个默认值，这样就不需要准备就绪
//这种方式通常比“听”更适合我
@属性（观察者：“ToggleStateonSasselection”）
字符串countrySelectedItemLabel=''；
//如果使用了`@属性（观察者：…）函数签名
//必须改变
@可反射
void togglestateonusasselection（字符串标签，[\u]）{
开关（国家/地区选择编辑标签）{
//我不确定你到底想在这里完成什么
//但这让我重现了你的问题
“美利坚合众国”案：
set（'hidstate'，false）；
打破
违约：
设置（'hidstate'，true）；
}
}
void ready（）{
设置（'hidstate'，true）；
}
}

html
<!DOCTYPE html>
<dom-module id='app-element'>
  <template>
    <paper-dropdown-menu
        label="Country *"
        selected-item-label="{{countrySelectedItemLabel}}"
        error-message="Country is required"
        id="countryDdm">
      <paper-menu class="dropdown-content">
        <template
            is="dom-repeat"
            items="[[countries]]"
            as="country">
          <div label="[[country]]">[[country]]</div>
        </template>
      </paper-menu>
    </paper-dropdown-menu>
    <div>selectedItem:<span>[[countrySelectedItemLabel]]</span> value: <span>[[countrySelectedItemLabel]]</span></div>
    <div>hideState: <span>[[hideState]]</span></div>
    <div class="layout horizontal">
      <paper-dropdown-menu
          hidden$="[[hideState]]"
          label="State *"
          selected-item-label="{{stateSelectedItemLabel}}"
          id="stateDdm">
        <paper-menu class="dropdown-content">
          <template
              is="dom-repeat"
              items="[[states]]"
              as="state">
            <div>[[state.name]]</div>
            <br>
          </template>
        </paper-menu>
      </paper-dropdown-menu>
    </div> <!-- missing in your question -->
  </template>
</dom-module>


[[国家]]
selectedItem:[[countrySelectedItemLabel]]值：[[countrySelectedItemLabel]]
hideState:[[hideState]]
[[state.name]]


忘了提及，我的示例与您的示例不完全相同，因为我只使用了国家字符串，而不是您似乎使用的地图或类。很高兴听到您解决了这个问题：）忘了提及，我的例子和你的不完全一样，因为我只是用字符串表示国家，而不是像你看起来那样使用地图或类