我目前正致力于将Backbone项目移植到Angular 2项目(显然有很多变化),其中一项项目要求需要某些方法可以公开访问.
一个简单的例子:
零件
@component({...})
class MyTest {
private text:string = '';
public setText(text:string) {
this.text = text;
}
}
Run Code Online (Sandbox Code Playgroud)
显然,我可以<button (click)="setText('hello world')>Click me!</button>,我也想这样做.但是,我希望能够公开访问它.
像这样
<button onclick="angular.MyTest.setText('Hello from outside angular!')"></click>
Run Code Online (Sandbox Code Playgroud)
或这个
// in the js console
angular.MyTest.setText('Hello from outside angular!');
Run Code Online (Sandbox Code Playgroud)
无论哪种方式,我希望该方法公开暴露,以便可以从angular 2应用程序外部调用它.
这是我们在骨干网上所做的事情,但我想我的Google foo不够强大,无法使用angular找到一个好的解决方案.
我们宁愿只公开一些方法并列出公共api,所以如果你有这方面的提示,那将是一个额外的奖励.(我有想法,但欢迎其他人.)
从Angular应用程序中可以创建浏览器的子窗口并在其中显示一些预定义的角度组件.
澄清:我不是在寻找模态对话解决方案.
使用Javascript Infovis Toolkit作为绘制图形和树木的外部库.我需要操作节点的onClick方法,以便异步地向服务器发送HTTP GET请求,并将来自服务器的数据分配给Angular服务类的属性和变量.通过使用webpack将所有已编译的类型脚本打包到单个js文件中,输出文件令人困惑且无法读取.因此,从外部js库调用已编译的js文件中的函数并不是最好的解决方案.
我在Angular服务中尝试以下解决方案,以便我可以毫无困难地访问此服务的属性:
document.addEventListener('DOMContentLoaded', function () {
var nodes = document.querySelectorAll(".nodes"); // nodes = []
for (var i = 0; i < nodes.length; i++) { // nodes.length = 0
nodes[i].addEventListener("click", function () {
// asynchronously sending GET request to the server
// and assing receiving data to the properties of this Angular service
});
}
});Run Code Online (Sandbox Code Playgroud)
但是,此解决方案不起作用,因为在Javascript Infovis Toolkit中,节点是在完成DOM渲染之后以及window.onload事件之后绘制的.这个库有一些生命周期方法,比如onAfterCompute(),它在绘图树完成后调用.如何触发全局事件以通知Angular服务树的绘制已完成并且它可以查询所有节点?
我想将点击事件附加到动态创建的 html 元素。单击事件应该能够触发组件中的另一个方法。
我已经看过其他建议使用 ElementRef 附加事件的 SO 答案。但是,它不适用于我的情况。
我正在使用 mapQuest API 来渲染地图。地图将绘制地理编码并添加滚动内容。要添加翻转内容,我正在使用 mapQuest 的 API 方法,例如info.setInfoContentHTML('<a>click me</a>');
仅供参考:https : //developer.mapquest.com/documentation/javascript-api/pois-infowindows/
该链接将在弹出窗口内,当用户将鼠标悬停在图标上时,该链接将通过插件动态添加到 dom 中。如何在仅当用户悬停时显示的链接上添加事件侦听器,并且没有插件提供的回调事件可以在显示悬停弹出窗口后触发。
我一直在寻找类似 jQuery live 的功能,尽管元素不在 DOM 上,但它会附加事件侦听器。
嗨,我需要从类型脚本文件中调用一个普通的javascript 函数。
假设我有一个 javascript 文件名test.js并且我已经在应用程序的 index.html 中导入了这个文件。
现在我需要从app.component.ts文件中调用这个test()函数。
function test(){
cosole.log('test');
}
Run Code Online (Sandbox Code Playgroud) angular ×4
javascript ×2
typescript ×2
angular6 ×1
browser ×1
childwindow ×1
components ×1
webpack ×1