how to call a jquery plugin from inside an angular.dart component?

感情迁移 提交于 2019-12-20 02:52:41

问题


I am learning about angular.dart components by trying to make one that will access an existing jquery plugin. I am trying something like the following:

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);
      }
    });
  }
}

Unfortunately, the 'container' seems to be empty... How to make jQuery select an element that is inside a component, i.e. in shadow dom?

BTW, what is the currently recomended way to import js? I have found this:

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

but now that some part of the functionality of package js being moved into dart:js, I'm not sure what one is supposed to do.


回答1:


The problem seems to be a jQuery problem. Perhaps it would work with :

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

About dart:js versus package:js (see 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).

About js namespace you can do what you want. I personnaly prefer to use a prefix to better see when interaction with Js is done. But it's a matter of taste.



来源:https://stackoverflow.com/questions/20586905/how-to-call-a-jquery-plugin-from-inside-an-angular-dart-component

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!