我试图在一个组件中单击一个按钮,将焦点放在另一个组件上的元素上.(坦率地说,我不明白为什么这一定必须如此复杂,但我无法实现任何实际有效的简单方法.)
我正在使用一项服务.除了发生点击之外,它不需要传递任何数据.我不确定听力组件是如何响应事件的.
app.component:
跳到主要内容
import { Component } from '@angular/core';
import { SkipToContentService } from './services/skip-to-content.service';
export class AppComponent {
constructor(
private skipToContent: SkipToContentService
) {}
}
skipLink() {
this.skipToContent.setClicked();
}
}
Run Code Online (Sandbox Code Playgroud)
登录组件:
<input type="text" name="username" />
import { Component, OnInit } from '@angular/core';
import { SkipToContentService } from '../../../services/skip-to-content.service';
export class BaseLoginComponent implements OnInit {
constructor(
private skipToContent: SkipToContentService
) {
}
ngOnInit() {
this.skipToContent.skipClicked.subscribe(
console.log("!")
// should put focus() on input
);
}
}
Run Code Online (Sandbox Code Playgroud)
跳跃到content.service:
import …Run Code Online (Sandbox Code Playgroud) 我想在事件上更改select2增强控件上的占位符.
所以我有这个......
<select id="myFoo" placeholder="Fight some foo...">
Run Code Online (Sandbox Code Playgroud)
......然后增强:
init: function(){
$('#myFoo').select2();
},
Run Code Online (Sandbox Code Playgroud)
...所以现在它有正确的占位符.
但后来我希望它对事件作出反应并清除占位符......
someButtonPress: function(){
// $('#myFoo').placeholder("");
// $('#myFoo').attr('placeholder', "");
// $('#myFoo').select2('placeholder',"");
// $('#myFoo').select2({placeholder:""});
// none of these work
}
Run Code Online (Sandbox Code Playgroud)
这看起来很基本,但我很难过.
我在文档中找不到任何内容.我在找错了地方吗?
我有一个辅助选择奴隶到主要选择(选择一个商店,然后选择一个部门 - 相同的选择一个国家,然后选择一个州).
无论我撕掉多少其他代码,我绝对无法使用select2('enable',false)和('data',null)方法.
<select id="stores">
<option value="foo">foo</option>
</select>
<select id="depts">
<option value="bar">bar</option>
</select>
// ...some logic that selects a store, then fetches that store's depts ...
$('#depts').select2('enable',false);// does not disable control
$('#depts').select2('data',null); // does not clear control
Run Code Online (Sandbox Code Playgroud)
所以我被迫这样做:
$('select#depts').empty(); // clears HTML element
$('#depts').select2(); // re-enhances select w/ select2
$('#depts').select2('disable',true); // disables
Run Code Online (Sandbox Code Playgroud)
它在jsfiddle中表现得很好,所以我甚至无法发布示例并请求帮助.我只是......难过.
我正在制作“跳转到内容”链接。链接在app.component 中,内容在login.component 中,还有目标。
我尝试了几种方法,但都没有奏效。所以现在我正在尝试发射器/监听器:
app.component (emitter):
import { Component, Output, EventEmitter} from '@angular/core';
export class AppComponent {
@Output() skipToCtrl: EventEmitter<any> = new EventEmitter();
skipLink() {
this.skipToCtrl.emit();
}
}
<a href="#content-start" (click)="skipLink()">Skip to main content</a>
Run Code Online (Sandbox Code Playgroud)
login.component(侦听器):
<input type="text" #firstControl name="username" />
Run Code Online (Sandbox Code Playgroud)
不知道登录如何从登录中订阅事件。我一直在寻找文章,说不能这样做如何订阅事件在Angular2服务?但没有描述如何做到这一点的文章。
我需要将一些模拟数据的行尾转换为Unix格式。我在Win 7上使用Atom编辑器。
在线查看时,我找到了一个Atom包来转换行尾,但是该包说它已被弃用,因为Atom现在已将此功能作为标准功能。
我在Atom中找不到任何这样的标准功能-而且Atom的文档甚至不知道行尾转换是什么。
“关于Atom”告诉我Atom是v.1.23.3的最新信息
在我看来,这似乎是一个悖论。
(不,我不能只使用记事本++。)
我到处查看了很多解决方案,但是还没有找到真正可行的解决方案。
如果每个父行在其子网格中具有相同数量的子行,并且因此具有相同的高度,则ui-grid的可扩展行功能非常有用.如果subGrid中的子行数与父行的行数不同,则不是很好.
我已经能够通过传入数组长度并使用它生成subGrid-height来使subGrid ITSELF具有动态高度:
lengthOfList: data[i].friends.length
style="height:{{row.entity.subGridOptions.lengthOfList * 30}}px;
Run Code Online (Sandbox Code Playgroud)
但由于该子网格必须在父网格中存在,因此父网格需要向下推动其行以腾出空间.它需要通过每行不同的amonut来实现.不幸的是,父网格对于所有行都有一个固定的expandableRowHeight.我无法为EACH行指定expandableRowHeight.
我希望最好的是动态改变expandableRowHeight,因为我点击一行打开它.
试图找出如何监听开放的可扩展行事件.
ui-grid是一个收缩包装插件,它编写自己的DOM元素,因此我无法向可能帮助我捕获事件的元素添加任何内容.
如何在运行中配置expandableRowHeight?
Plunker:
http://plnkr.co/edit/1IeEsXZAf9pRgKmy5jfO?p=preview
(the plunker行为不端.1]由于跨域问题,ui-grid正在使用的字体现在被阻止,2]有时html模板因为没有明显的原因而变为AWOL.)