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

Question

这对于那些你们谁能够从使用angular.dart V1.1.0一个飞镖应用程序创建一个可以工作的PhoneGap应用问题

我制作了一个非常简单的Dart应用程序。它只有一个包含三个文件的“web”目录：用于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构建来构建这个应用程序。这会生成一个包含Web目录的构建目录。我用web目录的内容创建一个.zip文件。我将zip文件上传到生成.apk文件的phonegap build。我将.apk文件安装到手机中，使用USB电缆将手机连接到笔记本电脑以进行Chrome调试。我开始应用程序。

“网络”选项卡中显示，一切都是为了：

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中运行应用程序。

因此有没有人遇到过这个问题？如果是这样，有没有人找到解决这个问题的办法？

我用飞镖1.8.5和1.1.0 angular.dart

我已经看到了这一点：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'; 

这添加到应用程序模块：

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构建。

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

谢谢