Question

我正在编写一个Dart Angular2应用程序，但它与手头的问题无关。

我试图通过使用1https：//pub.dartlang.org/packages/js公开它的API来使用Auth0Lock。

我使用Dartium调试应用程序。

所以我使用以下auth0lock.dart文件公开了Auth0Lock API：

import 'package:js/js.dart';

@JS()
class Auth0Lock {
 external factory Auth0Lock(String token, String domain, Object options);
  external on(String event, Function func);
  external show();
}

我只暴露了我需要的基本东西。

然后我在名为auth0_service.dart的文件中创建了一个Angular2服务，其中包含以下代码：

import＆＃39; package：angular2 / core.dart＆＃39 ;; import＆＃39; auth0lock.dart＆＃39 ;; 导入＆＃39; app.config.dart＆＃39;;

@Injectable()
class Auth {
Auth0Lock lock;

Auth() {
    this.lock = new Auth0Lock(configObj.auth0.apiKey, configObj.auth0.domain,{});
}
updateProfileName(data) {
  var profile = data['profile'] != null ? data['profile'] : data;
  print(profile['name']);
}

authenticated() {
  return false;
}

login() {
    this.lock.show().then(this.updateProfileName);
}


}

我还会在我加载auth0：

的地方显示我的index.html

<!DOCTYPE html>
<html>
<head>
    <title>Demo App</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" href="www/styles.css">
    <script src="https://cdn.auth0.com/js/lock/10.0.0/lock.min.js"></script>
    <script defer src="/web/main.dart" type="application/dart"></script>
    <script defer src="/packages/browser/dart.js"></script>
</head>
<body>
    <my-app></my-app>
</body>
</html>

当我运行我的应用程序时，我得到了以下错误：

EXCEPTION: No static method 'Auth0Lock.' declared in class 'Auth0Lock'.

所以Auth0Lock不是一个静态方法，它是该类的构造函数。所以我必须以某种方式使用JS api错误。

Answer 1

我需要在auth0lock.dart之前加上以下内容：

@JS()
library test;

实际上我可以将test重命名为我想要的任何内容...我只需要添加带有名称的js标记和库。解决了它。

使用js.dart公开auth0 API

1 个答案: