dart - AngularDART 组件

标签 dart angular-dart

我在学习 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>不工作,不显示任何东西!

谢谢

最佳答案

Angular Transformer 从 lib 中挑选组件文件夹。如果您将组件的文件(.dart、.html、.css)放在其他文件夹(即 web )中,则需要在 pubspec.yaml 的转换器部分中指定它们。

例如,

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

希望这对你有用。

关于dart - AngularDART 组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25089595/

相关文章:

dart - 如何将复杂对象 @Input 放入我的 AngularDart 组件中?

dart - 如何使用 Dart 编辑器生成 javascript

dart - 如何在angularDart项目中使用轮廓 Material 图标?

flutter - 使用 Flutter 编写的 Windows 桌面应用程序,编译为机器代码还是字节码?

android - 如何更改 WiFi 热点名称并在 Flutter 中执行 Wifi 扫描?

google-chrome-extension - 在Chrome打包的应用中从manifest.json读取版本

dart - 使用 Angular Dart 中的日志记录包的记录器服务

html - 在 AngularDart 中的 Material 选项卡之间切换会破坏子元素

android - 如何在 flutter 中从 UST 获取本地时间

firebase - Flutter:Firebase 如何更改查询和内容