WPF CefSharp 与Angular js 界面的互操作

  首先创建一个与AngularCompnent交互的类
public class WPFAngularObj
    {
        private IJavascriptCallback wpfToAngularCallback;

        public void wpfToAngularExecute(string msg)
        {
            wpfToAngular(wpfToAngularCallback);
            wpfToAngularCallback.ExecuteAsync(msg);
        }

        public void wpfToAngular(IJavascriptCallback javascriptCallback)
        {
            this.wpfToAngularCallback = javascriptCallback;
        }

        public void angularToWPF(string msg)
        {
            MessageBox.Show(msg);
        }
    }

其次创建一个Angular应用 修改AppComponent 如下:

constructor(private detechChangeRef:ChangeDetectorRef){
  }

  ngOnInit(){
    /* WPF 调用 Angular */
    window['wpfToAngularObj'].wPFToAngular((msg)=>{
      this.title=msg
      this.detechChangeRef.detectChanges()
    })
  } 


  /*Angular 调用  C# */
  mytest(ds){
    window['wpfToAngularObj'].angularToWPF(this.title)
  }

最后在主程序中注册交互类的实例,并执行调用方法即可

private WPFAngularObj wPFAngularObj;
        public MainWindow()
        {
            InitializeComponent();
            wPFAngularObj = new WPFAngularObj();
            CefSharpSettings.LegacyJavascriptBindingEnabled = true;
            this.sdfs.RegisterJsObject("wpfToAngularObj", wPFAngularObj);
        }

        public Object page
        {
            get;set;
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            wPFAngularObj.wpfToAngularExecute(this.sd.Text);
        }

注:
1、Angular 应用必须在构造器中传入 监测器,否则程序运行结束,但界面不会刷新
2、C# callback注册的方法必须遵守 首字母小写的 命名规范,否则将不能实现方法的绑定

你可能感兴趣的:(.NET)