Dart, Web_UI 및 Google지도를 약간 더 복잡한 방법으로 사용합니다.

Question

Google지도 라이브러리를 빌드하려고 시도한 다트 앱과 함께 web_ui를 사용하려고합니다. 매우 초조 한 실수 많이. github의 dart google maps example에 예제를 다운로드했는데 제대로 작동합니다.

그러나 "실제"앱을 조금 더 추가하면 아무 것도 작동하지 않습니다. 코드에서 어떤 일이 일어나고 무엇

Breaking on exception: ReferenceError: ReceivePortSync is not defined 

Uncaught ReferenceError: ReceivePortSync is not defined 
    ProxiedObjectTable (:54:21) 
    (:195:28) 
    (:567:3) 
Breaking on exception: The null object does not have a method 'callSync'. 

Exception: The null object does not have a method 'callSync'. 

NoSuchMethodError : method not found: 'callSync' 
Receiver: null 
Arguments: [GrowableObjectArray len:0] 
    Object.noSuchMethod (dart:core-patch/object_patch.dart:20:25) 
    _enterScope (package:js/js.dart:756:35) 
    scoped (package:js/js.dart:745:26) 
    AlertDetailsComponent.renderMap (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertDetails.dart:381:14) 
    AlertDetailsComponent.loadAlertDetailsData (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertDetails.dart:321:25) 
    AlertsBodyComponent.viewAlertDetails (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertsBody.dart:232:36) 
    AlertsBodyComponent.created_autogenerated.<anonymous closure>.<anonymous closure> (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertsBody.dart:146:60) 
    Template.listen.<anonymous closure> (package:web_ui/templating.dart:426:53) 
    _enterScope (package:js/js.dart:756:35) 
    scoped (package:js/js.dart:745:26) 
Exception: The null object does not have a method 'callSync'. 

NoSuchMethodError : method not found: 'callSync' 
Receiver: null 
Arguments: [GrowableObjectArray len:0] 
    Object.noSuchMethod (dart:core-patch/object_patch.dart:20:25) 
    _enterScope (package:js/js.dart:756:35) 
    scoped (package:js/js.dart:745:26) 
    AlertDetailsComponent.renderMap (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertDetails.dart:381:14) 
    AlertDetailsComponent.loadAlertDetailsData (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertDetails.dart:321:25) 
    AlertsBodyComponent.viewAlertDetails (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertsBody.dart:232:36) 
    AlertsBodyComponent.created_autogenerated.<anonymous closure>.<anonymous closure> (http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/AlertsBody.dart:146:60) 
    Template.listen.<anonymous closure> (package:web_ui/templating.dart:426:53) 
    _enterScope (package:js/js.dart:756:35) 
    scoped (package:js/js.dart:745:26) 
Failed to load resource: the server responded with a status of 404 (Not Found) 
    http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/js/jquery.js 
Failed to load resource: the server responded with a status of 404 (Not Found) 
    http://127.0.0.1:3030/Users/ao85407/Development/Dart/BDProjects/adminConsoleV2/web/out/js/bootstrap.js 

구성 요소가 렌더링 될 때 사용자 지정 "경고"개체에 대한 핸들을 얻을이 기능지도를 구축하는 데 사용할 것입니다 : 여기에 오류 내가 갖는은 다음과 같습니다 : 내가 작품을 시도한하는 MapOptions 아무것도를 만들려고 할 때

Object renderMap(Alert alert) 
    { 
    final lat = double.parse(alert.latitude); 
    final lng = double.parse(alert.longitude); 

    final mapOptions = new MapOptions() 
       ..zoom = 14 
       ..center = new LatLng(lat, lng) 
       ..mapTypeId = MapTypeId.ROADMAP; 

    final map = new GMap(query("#map-canvas"), mapOptions); 
    js.retain(map); 

    //clever troubleshooting/debugging methods 
    map.onZoomChanged.listen((ignored) 
     { 
      print ('zoom: ${map.zoom}'); 
     }); 
    return map; 
    } 

충돌이 발생합니다. 필자는 페이지 수명주기와 라이브러리가로드 될 때 응용 프로그램 다트 파일의 기본 메소드에서 몇 페이지 떨어져 있기 때문에로드를 수행해야한다고 생각합니다.

어떤 제안이 좋을까요?

감사합니다.

<script src="packages/browser/interop.js"></script> 

BREAKING CHANGE: js-interop will require extra script in html를 참조하십시오

Answer 1

당신은 JS-상호 운용성를 사용하는 페이지에 다음과 같은 JS 스크립트를 사용합니다.