Question

对于那些能够使用angular.dart v1.1.0的Dart应用程序构建可用的Phonegap应用程序的人来说，这是一个问题

我做了一个非常简单的Dart应用程序。它只有一个＆＃34; web＆＃34;包含三个文件的目录：用于Phonegap的index.html，main.dart和config.xml。

index.html包含在body标签的末尾：

<script type="application/dart" src="main.dart"></script>
<script data-pub-inline src="packages/browser/dart.js"></script>

main.dart包含：

import 'dart:html';
import 'package:angular/angular.dart';
import 'package:angular/application_factory.dart';

class AppModule extends Module{
  AppModule(){

  }
}

void main() {
  applicationFactory().addModule(new AppModule()).run();
}

pubspec.yaml文件包含：

name: test_app
version: 0.0.1
description: A test app.
environment:
  sdk: '>=1.0.0 <2.0.0'
dependencies:
  angular: any
  browser: any
transformers:
  - angular

config.xml内容是：

<?xml version="1.0" encoding="UTF-8" ?>
<widget xmlns   = "http://www.w3.org/ns/widgets"
    xmlns:gap   = "http://phonegap.com/ns/1.0"
    id          = "com.test.app.example"
    versionCode = "10"
    version     = "1.0.0" >

    <name>TestApp PhoneGap Example</name>

    <description>
        An example of phonegap app.
    </description>

    <author href="https://build.phonegap.com">Me</author>

    <gap:platform name="android" />

    <access origin="*"/>
</widget>

我使用pub build来构建这个应用程序。这将生成包含Web目录的构建目录。我用web目录的内容创建一个.zip文件。我将zip文件上传到phonegap build，生成.apk文件。我将.apk文件安装到手机中，使用USB线将手机连接到笔记本电脑进行Chrome调试。我启动了应用程序。

＆＃34;网络＆＃34;选项卡显示所有内容都按顺序排列：

file:///android_asset/www/index.html
file:///android_asset/www/packages/browser/dart.js
file:///android_asset/www/main.dart.js
Request method GET, Status code: 200

问题是控制台显示：相对URL解析需要有效的基本URI

所以应用程序不起作用。如果我使用组件，装饰器等，由于此错误，它们将不会被使用。如果我使用angular.dart v0.14.0或者如果我在Dartium中运行应用程序，我就没有这个问题。

之前有人遇到过这个问题吗？如果是这样，有没有人找到解决这个问题的方法？

我使用dart 1.8.5和angular.dart 1.1.0

我已经看到了这一点：https://github.com/angular/angular.dart/commit/d929109333fe2370f5156df2204177ce37aa5bc0 但它似乎比修复它们会产生更多问题。

提前致谢！

Answer 1

现在我可以通过使用包装类覆盖ResourceUrlResolver类来使其工作。请参阅：

中的原始_getBaseUri（）方法

file://packages/angular/core_dom/resource_url_resolver.dart

因此，创建一个包装文件，如：

resource_url_resolver_wrapper.dart

将所有需要的库导入其中：

import 'dart:html';
import 'package:angular/angular.dart';
import 'package:angular/core_dom/type_to_uri_mapper.dart';

将整个ResourceUrlResolver类复制到包装器文件中并将其重命名为：

class ResourceUrlResolverWrapper implements ResourceUrlResolver

将_getBaseUri（）更改为：

static String _getBaseUri() {
  return "${Uri.base.scheme}://${Uri.base.authority}/";
}

现在转到main.dart文件并：

import 'package:yourApp/wrapper/location/resource_url_resolver_wrapper.dart';

并将其添加到app模块：

bind(ResourceResolverConfig, toValue: new ResourceResolverConfig.resolveRelativeUrls(false));
bind(ResourceUrlResolver, toImplementation: ResourceUrlResolverWrapper);

这应该是这样的：

import 'package:angular/angular.dart';
import 'package:angular/application_factory.dart';
import 'package:yourApp/wrapper/location/resource_url_resolver_wrapper.dart';

class AppModule extends Module{
    AppModule(){
        bind(ResourceResolverConfig, toValue: new ResourceResolverConfig.resolveRelativeUrls(false));
        bind(ResourceUrlResolver, toImplementation: ResourceUrlResolverWrapper);
    }
}

void main(){
  applicationFactory().addModule(new AppModule()).run();
}

现在您可以构建您的应用程序，压缩它并将其上传到Phonegap构建。将它安装在手机上即可使用。也许这会破坏别的东西。就我而言，它适用于Phonegap构建。

我希望找到更好的解决方案，所以也许其他人可以为此分享一个更清洁的解决方案。

由于

angular.dart - 相对URL解析需要有效的基URI

1 个答案: