Question

在我的Aurelia视图中，我有一个脚本标记，我想从我的视图模型中调用一个函数：

＆＃xA;＆＃xA;

page.html中：

＆＃XA;＆＃XA;

 <代码>＆LT;模板＆GT;＆＃XA; ...＆＃XA; ＆LT;脚本＆GT;＆＃XA; function beginEdit（args）{＆＃xA;的console.log（参数）;＆＃XA;的console.log（args.primaryKeyValue）;＆＃XA; //在这个地方我想调用sayHello（）函数＆＃xA; };＆＃XA; ＆LT; /脚本＆GT;＆＃XA;＆LT; /模板＆GT;＆＃XA;

＆＃XA;＆＃XA;

Page.js：

＆＃xA;＆＃xA;

 从'aurelia-framework'导入{inject}＆＃xA;从'aurelia-http-client'导入{HttpClient};＆＃xA; import {Router来自'aurelia-router';＆＃xA;＆＃xA; export class Licigrid {＆＃xA; constructor（）{...}＆＃xA;激活（）{...}＆＃XA; ...＆＃XA;的sayHello（）＆＃XA; {＆＃XA;警报（ “你好”）;＆＃XA; }＆＃xA;}＆＃xA;

＆＃xA;＆＃xA;

我试图在我的脚本标签 $ {sayHello（）;} 但这会在页面加载时立即调用该函数，而不是在用户输入 beginEdit（）函数时调用该函数。

＆＃xA;＆＃xA; 我有在 Plunker 中复制了这段代码。
＆＃xA;＆＃xA ; 请注意，我正在使用一个自己调用beginEdit函数的包，所以不幸的是我不能在我的html标签中使用.trigger（）,. delegate（）或.call（）来解决我的问题。 
＆＃xA;＆＃xA; 我的问题是：是否有解决方案从我的脚本标记中调用 sayHello（）函数？＆＃xA;

Answer 1

beginEdit函数需要访问App视图模型实例。我们可以使用Aurelia的DI容器来检索：

var app = container.get(App);
app.sayHello();

问题是我们无法访问beginEdit功能中的容器。我们可以使用小黑客来访问容器：

var container = document.body.aurelia.container;

我们还需要App构造函数，因为它是从容器中检索app实例的关键。我们可以使用System loader来加载包含App构造函数的模块：

System.import('app').then(function(module) {
  var App = module.App;
});

所有这一切看起来像这样：

function beginEdit() {
  System.import('app').then(function(module) {
    var App = module.App, // get the constructor function
        container = document.body.aurelia.container, // get the container
        app = container.get(App);  // get the instance of App (the viewmodel)
    app.sayHello();
  });
}

这是工作的傻瓜： http://plnkr.co/edit/9c0oJmifjW5pXXdD06Hg?p=preview

从<script>

1 个答案: