dart - Dart 中 Angular 和 Polymer 之间的对象绑定(bind)

标签 dart dart-polymer angular-dart

我正在尝试将对象从 Angular 控制元素绑定(bind)到 Dart 中的 Polymer 元素。

要绑定(bind)的对象:

class Person {
  String name;
  String surname;

  Person(this.name, this.surname);
}

聚合物元素模板:

<link rel="import" href="packages/polymer/polymer.html">

<polymer-element name="person-element">
  <template>
    <style>
     .label {font-weight: bold;}
    </style>
    <p>
      <span class="label">Name: </span>{{person.name}}
      <span class="label">Surname: </span>{{person.surname}}
    </p>
  </template>
  <script type="application/dart" src="person_element.dart"></script>
</polymer-element>

高分子元素代号:

import 'package:polymer/polymer.dart';
import 'person.dart';

@CustomTag('person-element')
class PersonElement extends PolymerElement {
  @published Person person;

  PersonElement.created() : super.created();
}

在 Angular 中,我创建了一个 Controller 和一个模块:

@Controller(
    selector: '[person-container]',
    publishAs: 'ctrl')
class PersonController { 
  List<Person> persons = [new Person('John','Smith'), new Person('Mario','Rossi')];
}

class PersonModule extends Module {
  PersonModule() {
    bind(PersonController);
  }
}

第一个解决方案尝试使用 angular_node_bind包裹:

<div person-container ng-cloak>
  <h2>Person elements</h2>
  <div ng-repeat="person in ctrl.persons">
    <div>{{person.name}}</div>
    <person-element person="[[person]]"></person-element>
  </div>
</div> 

当我在 Dartium 中运行应用程序时,出现此错误:

Exception: type 'String' is not a subtype of type 'Person' of 'value'. (http://localhost:8080/person_element.dart:6)

我也试过用这种方式修改html代码中的属性实例化:

<person-element person=[[person]]></person-element>

但我得到了同样的异常(exception)。

angular_node_bind 包支持对象绑定(bind)吗?

第二种解决方案正在使用 new binding features of Angular 0.14.0并以这种方式结合聚合物元件:

使用此解决方案,我没有遇到任何异常,元素是可视化的,但字段为空且人员实例为空。

完整的例子在这里:https://github.com/fedy2/dart-angular-polymer-object-data-binding

最佳答案

新版本的 AngularDart (0.14.0) 支持 Polymer-Dart 绑定(bind) (http://blog.angulardart.org)。
目前,不同版本可能存在一些问题:
Pub get failed, [1] Resolving dependencies... Incompatible version constraints on code_transformers

关于dart - Dart 中 Angular 和 Polymer 之间的对象绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25807193/

相关文章:

dart - 为什么Dart只允许在初始化列表中初始化Final变量?

flutter - 使用 flutter/dart 加密并使用 CryptoJS 解密 aes 返回空字符串

dart - 在 dart-polymer 1.x 中设置隐藏属性

dart - 在单下划线之后的双下划线作为函数/类方法的参数的目的是什么?

HTML 导入 : CustomTag not registered

dart - Angular Dart - 使用 router.go 将数据发送到 Controller

dart - 首先列出Where Bad state : No element

android-layout - 不明白在哪里使用Void函数和Return类型函数

angular - 如何使用 angular dart webdev 在 localhost 上建立安全连接?

dependency-injection - 什么是值(类型,空)