我有使用flex-box的以下代码
<!DOCTYPE html>
<polymer-element name='test-flex'>
<template>
<style>
.lab-flex-col-container {
display: flex;
flex-flow: column;
align-content: center;
background-color: gold;
border-radius:5px;
margin: 5px;
}
.lab-flex-col {
display:flex;
flex-flow:column;
align-self:center;
margin:5px;
}
.margin2 { margin: 2px; }
</style>
<form id='form'
class='form'>
<div class='lab-flex-col-container'>
<div class='lab-flex-col' id='hidden-does-not-work' hidden>
<input id='hidden-works' type='text'>
</div>
<div id='hidden-works' hidden>
<textarea></textarea>
</div>
<div id='hidden-does-not-work-here-either' class='lab-flex-col' hidden>
<button>Save</button>
</div>
</div>
</form>
</template>
<script type="application/dart;component=1">
import 'package:polymer/polymer.dart';
import 'dart:html';
@CustomTag( 'test-flex' )
class TestFlex extends PolymerElement
{
TestFlex.created() : super.created();
ready()
{ …我有以下组件创建一个MdDialog
export class SideNavsComponent implements OnInit, AfterViewInit, OnDestroy {
eventDispatcher: EventDispatcher
authEmailDialogRef: MdDialogRef<AuthEmailDialogComponent>
constructor(public dialog: MdDialog,) {
this.eventDispatcher = new EventDispatcher()
}
signIn( event ): void {
this.isSignedIn = event.checked
this.openDialog()
}
openDialog() {
this.authEmailDialogRef = this.dialog.open( AuthEmailDialogComponent, {
height: '500px',
width: '300px',
disableClose: true
} )
}
ngOnDestroy() {
}
ngAfterViewInit() {
}
ngOnInit() {
event_dispatcher.on( 'CLOSE authEmailDialogRef', ( target: Object ) => {
this.authEmailDialogRef.close()
} )
}
}
下面的组件创建一个按钮,单击该按钮时,通过发送和在SideNavsComponent#ngOnInit方法中截获的事件来关闭上面创建的MdDialog
export class AuthEmailDialogComponent implements OnInit {
eventDispatcher: EventDispatcher = …我在Angular2 Dart Angular中看到了Dart Cheat Sheet(v2.0.0-beta.2),支持Elvis运算符.
我试图在组件视图中使用它,但似乎这里不允许.
特定
<div
<label
for = "first">First<span class = "require">*</span></label>
<input
type = "text"
[(ngModel)] = "name?.first"
id = "first">
...
Name name = new Name();
...
运行该应用程序会出现以下错误:
Transform TemplateCompiler on
epimss_ng2_reg|lib/components/name_component.ng_meta.json threw error: Template parse errors:
Parser Error: The '?.' operator cannot be used in the assignment at column 13 in [name?.first=$event] in NameComponent@39:12 ("
<input
type = "text"
[ERROR ->][(ngModel)] = "name?.first"
#firstCtrl = "ngForm"
[ngFormControl] = …我在类中有以下import语句
import 'package:dart_web_toolkit/ui.dart';
import '../../util/flex_table_builder.dart' as ftBldr;
import '../factors_list_view.dart';
class MediatingFactorsView extends Composite
{
//...
}
但是,最后一个导入语句会标记一个警告:
The different imported libraries 'flex_table_builder.dart' and 'factors_list_view.dart' should not have the same name
名称是完全不同的,我看到在我更新到最新的Dart编辑器后,我的代码中重复了这一点.这是一个错误吗？
角度为6.x的新angular.json文件作为其结构的一部分具有以下内容
"styles": [{
"input": "src/styles.scss"
}],
"scripts": []
},
我当前的angular/cli v1.72与.angular-cli.json相同
"styles": [
"../scss/bootstrap/bootstrap.scss",
"../src/assets/styles/icon8.css",
"styles.scss",
"styles-props.css"
],
"scripts": [
"../node_modules/web-animations-js/web-animations.min.js",
"../node_modules/jquery/dist/jquery.js",
],
如何将v1.7.2转换为v 6.x格式？新格式的"输入"代表什么？
干杯
要在angular6中创建库,我们使用以下内容:
ng generate library my-lib
如果我们希望删除以前创建的库,那么该命令是什么:
大家问候大家!
我有以下代码构建一个基于materialize-css框架的单一单选按钮http://materializecss.com/forms.html#radio
<input name = 'group1'
type = 'radio'
id = 'test2'/>
<label for = 'test2'>Yellow</label>
我尝试使用*ngFor的方法如下所示:
statuses: string[] = [
'Single',
'Married',
'Divorced',
'Common-law',
'Visiting'
];
<p>{{maritalStatus?.status}}</p>
<div *ngFor = 'let status of statuses; let indx = index'>
<input #widget
class = 'with-gap'
name = 'statusGroup'
type = 'radio'
id = 'status'
[value] = 'status'
[(ngModel)] = 'maritalStatus.status'
(change) = 'radioBtnChange$.next(status)'
/>
<label for = 'status'>{{status}}</label>
<p>{{status}}{{ indx}}</p>
</div>
创建所有按钮,但只能选择第一个按钮(单个).
我怎样才能获得按钮系列功能作为单选按钮的功能？
谢谢
HTML 5具有新的数据属性data-*
鉴于以下用法:
<ul>
<li data-animal-type="bird">Owl</li>
<li data-animal-type="fish">Salmon</li>
<li data-animal-type="spider">Tarantula</li>
</ul>
我怎么能在Dart中访问这些属性.
我想将父组件的FormGroup传递给它的子组件,以便使用子组件显示错误消息
鉴于以下父母
import { Component, OnInit } from '@angular/core'
import {
REACTIVE_FORM_DIRECTIVES, AbstractControl, FormBuilder, FormControl,
FormGroup, Validators
} from '@angular/forms'
@Component(
{
moduleId: module.id,
selector: 'parent-cmp',
templateUrl: 'language.component.html',
styleUrls: ['language.component.css'],
directives: [
ErrorMessagesComponent]
})
export class ParentCmp implements OnInit {
form: FormGroup;
first: AbstractControl;
second: AbstractControl;
constructor(private _fb: FormBuilder) {
this.first =
new FormControl('');
this.second = new FormControl('')
}
ngOnInit() {
this.form = this._fb.group(
{
'first': this.first,
'second': this.second
});
}
}
import { Component, OnInit, Input …鉴于以下......
<form (ngSubmit) = "onSubmit()"
#heroForm = "ngForm">
{{diagnostic}}
<div class = "form-group">
<label for = "name">Name</label>
<input type = "text"
class = "form-control"
required
[(ngModel)] = "model.name"
ngControl = "name"
#name = "ngForm"
#spy>
<p *ngIf = "name.dirty"
class = "alert alert-danger">
Name is required
</p>
<!--<p [hidden] = "name.dirty"-->
<!--class = "alert alert-danger">-->
<!--Name is required-->
<!--</p>-->
</div>
..
..是否可以#name = "ngForm"在.dart组件中获取(ngForm)引用以允许操作？欢迎提出任何建议和更正.
angular ×5
dart ×3
angular-cli ×1
angular6 ×1
css ×1
dart-polymer ×1
flexbox ×1
html ×1
javascript ×1
materialize ×1
typescript ×1