javascript - UWP - WebView - Angular JS 注入(inject)

Question

我目前正在研究在 Windows 10 上开发的 UWP 应用程序。我正在使用 WebView 控件来显示第 3 方 HTML 页面。HTML 是使用 Angular JS 开发的。

问题:网页有一个函数ng-click = c.open();

我想通过我的 C# 代码使用 javascript/angular injection 覆盖此函数并附加 window.external.notify() 以便在单击按钮时通过 ScriptNotify() 事件 通知 UWP web View 的网页。

我是 javascript 和 angular 的新手，任何指示和指导都会非常有帮助。

 WebView.InvokeScriptAsync("eval", new[]
                                           {
                                                   @"(function(){
                                                       var hyperlinks = document.getElementsByClassName('btn');                                        
                                                        for(var i = 0; i < hyperlinks.length; i++)
                                                        {                                                           
                                                            **//What should i place here to override the btn ng-click fucntion??**
                                                        }
                                                    })()"

                                           });

Answer 1

WebView Control to display 3rd party HTML page.

根据您的要求，您可以使用 InvokeScriptAsync 注入(inject) eval 函数，您还可以覆盖 btn onclick 事件处理程序。但是您无法在 eval 函数中处理 Angular $scope，因为它在 javaScript 中被阻止了。即使您可以获得按钮对象并添加新的偶数处理程序，ng-click 仍然存在于按钮函数列表中。下面讲述了如何注入(inject) eval 并获取带有 id 的 html 元素。

await MyWeb.InvokeScriptAsync("eval", new[]
{
       @"(function(){                                          
         document.getElementById('btn').onclick = function () {
                    this.innerHTML = 'hello'                   
                }
        })()"

});

你可以在上面的方法中附加 window.external.notify()，但是你不能用它来返回 $scope 值。