首页 文章

AngularDART组件

提问于
浏览 次
4

我在学习AngularDART组件时制作了以下简单的代码，但没有显示任何内容，任何人都可以帮助我知道我犯了什么错误：

我的html主文件：

<!DOCTYPE html>
    <html>
    <head>
        <link rel="stylesheet" href="bootstrap.css">
        <link rel="stylesheet" href="main.css">
        <title>AngularDART training</title>
        <script type="application/dart" src="main.dart"></script>
        <script src="packages/browser/dart.js"></script>
    </head>
    <body ng-app>
        <h1 id='text_id'>Welcome</h1>
        <the-component></the-component>
    </body>
    </html>

main.dart文件是：

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

      @Component(
          selector: 'the-component',
          templateUrl: 'angularComponent.html',
          cssUrl: 'angularComponent.css',
          publishAs: 'cmp')
      class myComponent {var name = 'Component';}

      main() {
        var module = new Module()
                         ..bind(myComponent);

        applicationFactory().addModule(module).run();
      }

angularComponent.html文件是： <p>This is the angular: {{cmp.name}}</p>

<the-component></the-component> 无效，没有显示任何内容！

谢谢

dart angular-dart

3 回答

  • 2

    角度变换器从 lib 文件夹中选取组件 . 如果将组件的文件（.dart，.html，.css）放在其他文件夹（即 web ）中，则需要在pubspec.yaml的transformers部分中指定它们 .

    例如，

    transformers
   - angular:
     -html_files:
        - absolute/path/to/your/html

    希望这对你有用 .

    回复于
  • 3

    感谢所有试图提供帮助的人，解决方案是将pubspec.yaml写成：

    dependencies:
angular: '>=0.12.0 <0.13.0'
transformers:
- angular: {html_files: "web/angularComponent.html"}

    谢谢 .

    回复于
  • 1

    该错误是您的 pubspec.yaml 未将 angularComponent.html 列为资产 .

    创建 StaticClosureMap 的Angular变换器没有解析模板，从未看过 cmp.name 表达式，也从未生成过getter .

    我们应该给你一个更好的错误信息 . 如果您仍然完整地隔离了完整的项目，请在the Github project上提交一个错误，我们可以更好地体验这种体验 .

    回复于

相关问题