我创建了一个对话框并进行渲染。但是，如果窗口很小，则其父级可以将其隐藏。我在PaperDialog的layered属性上尝试了layered属性，它似乎无济于事。
others.html
<!DOCTYPE html>
<link href='../../../../packages/polymer/polymer.html' rel='import' >
<link href='../../../../packages/bwu_datagrid/bwu_datagrid.html' rel='import' >
<link href='../../../../packages/paper_elements/paper_input.html' rel='import' >
<polymer-element name='others-form'>
<template>
<paper-input floatinglabel multiline
id = 'description'>
</paper-input>
</template>
<script type='application/dart' src='others_form.dart'></script>
</polymer-element>
其他人
import 'package:polymer/polymer.dart';
import 'package:vacuum_persistent/persistent.dart' show PersistentMap;
import 'package:clean_data/clean_data.dart' show DataMap;
import 'package:epimss_shared/shared_event.dart' show eventBus,
PersistentMapEvent;
@CustomTag( 'others-form' )
class OthersForm extends PolymerElement
{
@observable String z = '3';
@observable DataMap<String, dynamic> selections;
String errorMsg;
OthersForm.created() : super.created();
@override
void attached()
{
super.attached();
selections = new DataMap<String, dynamic>.from({});
eventBus.on( PersistentMapEvent, ( event )
{
switch( event.topic )
{
case 'shared|description-form --> lab|routine-culture-rqst':
selections[ 'other' ] = event.pmap[ 'description' ];
break;
}
});
/*
selections.onChange.listen( (changeset)
{
if ((selections.length == 1 && !selections.containsKey( 'other' )) ||
selections.containsKey( 'other' ))
{
eventBus.signal(
new PersistentMapEvent (
new PersistentMap<String, String>.fromMap( selections ))
..topic = this.dataset[ 'topic' ]);
}
});
*
*/
}
}
ssss_form.html
<!DOCTYPE html>
<link href='../../../../packages/polymer/polymer.html' rel='import'>
<link href='../../../../packages/paper_elements/paper_icon_button.html' rel='import' >
<link href='../../../../packages/paper_elements/paper_shadow.html' rel='import'>
<link href='../../../../packages/paper_elements/paper_button.html' rel='import'>
<link href='../../../../packages/paper_elements/paper_dialog_transition.html' rel='import'>
<link href='../../../../packages/paper_elements/paper_dialog.html' rel='import'>
<link href='../../../../packages/html_components/input/select_item.html' rel='import'>
<link href='../../../../packages/html_components/input/select_checkbox_menu.html' rel='import'>
<link href='others_form.html' rel='import'>
<polymer-element name='ssss-form'>
<template>
<div layout horizontal>
<div layout vertical
id='specimen-div'
class='card'>
<h-select-checkbox-menu
label='Specimen'
on-selectionchanged='{{onSelectionChangedFiredSpecimen}}'>
<template repeat='{{key in specimens.keys}}'>
<h-select-item
label='{{key}}'
value='{{specimens[key]}}'>
</h-select-item>
</template>
</h-select-checkbox-menu>
</div>
<paper-shadow z='{{z}}'></paper-shadow>
</div>
<paper-dialog
id='other-dialog'
heading='Other'
transition='paper-dialog-transition-center'>
<others-form> </others-form>
<paper-button dismissive
label='More Info...' >
</paper-button>
<paper-button affirmative
label='Cancel'>
</paper-button>
<paper-button affirmative autofocus
label='Accept'>
</paper-button>
</paper-dialog>
</template>
<script type='application/dart' src='ssss_form.dart'></script>
</polymer-element>
ssss_form.dart
导入'
package:polymer/polymer.dart';
import 'dart:html';
import 'package:paper_elements/paper_dialog.dart';
import 'package:html_components/html_components.dart' show SelectCheckboxMenuComponent;
import 'package:vacuum_persistent/persistent.dart' show PersistentMap;
import 'package:clean_data/clean_data.dart';
import 'package:epimss_shared/shared_transformers.dart' show CheckboxMenuItemsConverter;
@CustomTag( 'ssss-form' )
class SsssForm extends PolymerElement with CheckboxMenuItemsConverter
{
DataSet<DataMap> selections;
DataMap<String, dynamic> specimenSelections;
PersistentMap<String, Map> pmap;
@observable
Map<String, dynamic> specimens = toObservable(
{
'CSF': 'CSF',
'Other': 'Other'
});
@observable String specimen = '';
@observable String z = '3';
var sideForm;
SsssForm.created() : super.created();
void onSelectionChangedFiredSpecimen( Event event, var detail,
SelectCheckboxMenuComponent target)
{
var list = getItemModels( target.selectedItems );
specimenSelections.clear();
list.forEach( (item)
{
specimenSelections[item.label] = item.selected;
/// Checks if [item] selected is equal to 'Other' and if so creates a
/// a dialogue to make the selection
if ( item.label == 'Other')
{ toggleDialog( 'paper-dialog-transition-center' ); }
});
}
toggleDialog( transition ) => $['other-dialog'].toggle();
@override
void attached()
{
super.attached();
specimenSelections = new DataMap<String, dynamic>.from({});
selections = new DataSet<DataMap>.from( [specimenSelections] );
}
}
others.html是对话框的内容-对话框位于ssss_form.html文件中。单击“标本”下拉菜单中的“其他”复选框时，将触发该对话框。
当应用程序运行时，我也会得到以下信息
Attributes on ssss-form were data bound prior to Polymer upgrading the element. This may result in incorrect binding types. (:1)
The "label" property is deprecated. (http://localhost:8080/polymer_bug.html:7467)
The "label" property is deprecated. (http://localhost:8080/polymer_bug.html:7467)
The "label" property is deprecated. (http://localhost:8080/polymer_bug.html:7467)
The "label" property is deprecated. (http://localhost:8080/polymer_bug.html:7467)
The "label" property is deprecated. (http://localhost:8080/polymer_bug.html:7467)
The "label" property is deprecated. (http://localhost:8080/polymer_bug.html:7467)
请参阅所附图形。
谢谢
最佳答案
我认为您只需要为zIndex CSS属性设置一个比该页面上所有其他HTML元素更高的值。
关于dart - 强制将 paper 对话框设为最上面的窗口，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26946547/