我知道Angular 2目前缺乏一种方法可以轻松地将表单重置为原始状态.我找到了一个类似下面的解决方案来重置表单字段.
有人建议我需要删除控制组并创建一个新的控制组来重建表单作为原始.我很难找到最好的方法来做到这一点.我知道我需要在一个函数中包装表单构建,但是在构造函数中执行此操作时遇到错误.
重建控件组以完全重置表单的最佳方法是什么？
class App {
name: Control;
username: Control;
email: Control;
form: ControlGroup;
constructor(private builder: FormBuilder) {
this.name = new Control('', Validators.required);
this.email = new Control('', Validators.required);
this.username = new Control('', Validators.required);
this.form = builder.group({
name: this.name,
email: this.email,
username: this.username
});
}
onSubmit(value: any): void {
// code that happens when form is submitted
// then reset the form
this.reset();
}
reset() {
for (let name in this.form.controls) {
this.form.controls[name].updateValue('');
this.form.controls[name].setErrors(null);
}
}
}
我在Angular 2中使用ViewChild来隔离一个元素.我可以直接操作样式,但是如果可以更改元素样式类,我找不到文档.
这是示例代码:
export class HomeComponent implements OnInit {
@ViewChild('slideBg') el:ElementRef;
ngAfterViewInit {
// style can be changed
this.el.nativeElement.style.background = 'red';
// does not work:
this.el.nativeElement.class = 'myCSSclass';
}
…
}
想看看这是否可行以及如何实现.任何帮助赞赏.
在 Gatsby 项目中，我有一个标题组件，它在每个页面上都是持久的。标题有一个模式来显示导航。每当路线更改时，我都需要将 isOpen 状态设置为 false，以便导航模式关闭。由于路线不仅可以通过单击模式中的链接来更改，还可以通过使用浏览器上的后退按钮来更改，因此我不希望在链接上使用事件来关闭模式。
在 Gatsby 中，我可以使用 gatsby-browser.js 中的 onRouteUpdate 来检测路由更改，这很有效。但是我需要将事件传递给我的组件，这就是我遇到困难的地方。我已经简化了下面的代码来显示设置。
gatsby-browser.js：
import React from "react"
import Layout from "./src/components/layout"
export const wrapPageElement = ({ element, props }) => {
return <Layout {...props}>{element}</Layout>
}
export const onRouteUpdate = () => {
console.log("onRouteUpdate") // this works
}
布局.js：
import React from "react"
import Header from "./header"
import Footer from "./footer"
const Layout = ({ children }) => (
<>
<Header />
<main>
{children}
</main>
<Footer />
</>
)
export …我有一个显示标题的Angular 2组件.有一个服务可以侦听来自其他组件的数据更改,并且可以更改标题的字符串值.
我希望使用Angular动画在加载时淡入文本,然后在标题文本更改时淡化/交叉渐变.我有fadein工作但不确定如何触发交叉渐变以及是否使用相同的转换.
这是迄今为止的代码:
import { Component, OnInit, Input, style, transition, animate, trigger } from '@angular/core';
import { DataTransferService } from '../services/data-transfer.service';
@Component({
selector: 'app-page-header',
template: '<h1 [innerHTML]="heading" [@fadeMe]="heading" *ngIf="heading != null"></h1>',
animations: [
trigger('fadeMe', [
transition('void => *', [style({opacity: 0}), animate('500ms ease-in', style({opacity: 1}))])
])
]
})
export class PageHeaderComponent implements OnInit {
public heading: string = '';
constructor(
private pageHeaderService: DataTransferService
) { }
ngOnInit() {
this.pageHeaderService.pageHeaderData$.subscribe(
data => {
this.heading = data['heading'];
});
}
}
任何帮助非常感谢.
我正在基于文档中的类别示例实现jQuery UI自动完成.我想将结果数添加到Categories标题中,因此它不显示"Products"而是显示"Products(3)".我知道_renderMenu函数需要从示例中修改,但我无法理解如何修改它.任何帮助我开始正确的道路将不胜感激.
以下是jQuery UI Autocomplete Categories演示的示例代码:
<script>
$.widget( "custom.catcomplete", $.ui.autocomplete, {
_renderMenu: function( ul, items ) {
var self = this,
currentCategory = "";
$.each( items, function( index, item ) {
if ( item.category != currentCategory ) {
ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
currentCategory = item.category;
}
self._renderItem( ul, item );
});
}
});
</script>
<script>
$(function() {
var data = [
{ label: "anders", category: "" },
{ label: "andreas", category: "" },
{ label: "antal", …我有一个带有嵌套子项的JSON对象，我想使用lodash进行扁平化和修改。理想情况下，修订后的JSON将具有嵌套子级所在的原始级别的值，并显示其原始路径。
这是示例JSON：
var data = [
{id: 0, name: 'Australia', children: [
{id: 10, name: 'Melbourne', children: []},
{id: 11, name: 'Sydney', children: [
{id: 100, name: 'Surry Hills', children: []},
{id: 102, name: 'Darlinghurst', children: []}
]},
{id: 13, name: 'Kambalda', children: []}
]},
{id: 1, name: 'Spain', children: [
{id: 20, name: 'Barcelona', children: []},
{id: 21, name: 'Madrid', children: []}
]},
{id: 3, name: 'UK', children: [
{id: 30, name: 'London', children: [
{id: 302, name: 'Knightsbridge', …我有一个 Javascript 应用程序，它从 WordPress 数据库中检索短代码。所以我最终可能会得到一个这样的变量：
var shortcode = '[wp-form id="1946" title="My Test Form"]';
我希望使用纯 Javascript 来访问属性，以便我可以提取标题等。我想这将是某种形式或正则表达式和 split()。但到目前为止，我的努力因被空格分割而受挫。
任何想法都非常感谢。
我有一个 PHP 函数，它接受传递的 url 并创建一个干净的链接。它将完整链接放在锚标记中，并仅显示 URL 中的“www.domain.com”。它运行良好，但我想对其进行修改，以便去掉“www”。部分也是如此。
<?php
// pass a url like: http://www.yelp.com/biz/my-business-name
// should return: <a href="http://www.yelp.com/biz/my-business-name">yelp.com</a>
function formatURL($url, $target=FALSE) {
if ($target) { $anchor_tag = "<a href=\"\\0\" target=\"$target\">\\4</a>"; }
else { $anchor_tag = "<a href=\"\\0\">\\4</a>"; }
$return_link = preg_replace("`(http|ftp)+(s)?:(//)((\w|\.|\-|_)+)(/)?(\S+)?`i", $anchor_tag, $url);
return $return_link;
}
?>
我的正则表达式技能不是那么强，因此非常感谢任何帮助。