jquery - 如何从 angular.dart 组件内部调用 jquery 插件?

标签 jquery dart angular-dart shadow-dom dart-js-interop

我正在通过尝试制作一个可以访问现有 jquery 插件的组件来学习 angular.dart 组件。我正在尝试类似以下内容:

library mylib;

import 'dart:html'; // querySelector
import 'package:js/js.dart'; // javascript 
import 'package:angular/angular.dart';

@NgComponent(
    selector: 'aSelector',
    templateUrl: 'partial.html',
    cssUrl: 'style.css',
    publishAs: 'ctrl',
    map: const {
      'param': '=>param'
    }
)
class myComponent extends NgShadowRootAware {
  String param;
  Compiler compiler;
  Injector injector;
  Scope scope;

  MyComponent(this.compiler, this.injector, this.scope);

  void onShadowRoot(ShadowRoot shadowRoot) {
    this.scope.$watch((int) => shadowRoot.querySelector('.myContainer').text.length, (currentValue, previousValue, Scope scope) {
      if (currentValue != previousValue) {
        var container = context.jQuery('.myContainer', shadowRoot);
        var options = map({
          'p1': 1,
          'p2': 2
        });
        container.jqplugin(options);
      }
    });
  }
}

不幸的是,“容器”似乎是空的...如何让 jQuery 选择组件内部(即 Shadow dom 中)的元素?

顺便问一下,目前推荐的js导入方式是什么?我发现了这个:

import 'package:js/js.dart' as js;

但是现在 js 包的部分功能被转移到 dart:js 中,我不确定应该做什么。

最佳答案

这个问题似乎是一个 jQuery 问题。也许它可以与:

var container = context.jQuery(shadowRoot.querySelector('.myContainer'));

关于 dart:jspackage:js (参见 How do you interact with js from dart? ):

package:js provides a simpler Api that comes at the cost of an increase of the js size (because package:js uses dart:mirrors and noSuchMethod).

关于js命名空间你可以做你想做的事。我个人更喜欢使用前缀来更好地查看与 Js 的交互何时完成。但这是一个品味问题。

关于jquery - 如何从 angular.dart 组件内部调用 jquery 插件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20586905/

相关文章:

javascript - 用于在页面上打印元素内容的跨浏览器解决方案是什么?

generics - Dart 2.7通用扩展

flutter - Dart/Flutter中的全局变量

Angular2 Dart - 在 Angular2 组件中获取文本

dart - webdev 为 .js.map 文件提供丢失的输出

javascript - 如果选中复选框,则更改类 bg

jquery - 在 jquery 中添加 mailto attr

javascript - 具有覆盖的不均匀响应图像/文本网格

javascript - Dartlang 类 VS JavaScript 类

dart - 在AngularDart中使用dart:html库