飞镖中的角度和聚合物之间的对象绑定

我试图将一个角度受控元素的对象绑定到飞镖中的聚合物元素。飞镖中的角度和聚合物之间的对象绑定

目的结合：

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(); 
}

在角我已经创建了一个控制器和一个模块：

@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>

但我得到同样的例外。

angular_node_bind包是否支持对象绑定？

的第二个解决方案是使用new binding features of Angular 0.14.0并以这种方式结合的聚合物元件：

有了这个解决方案，我没有得到任何异常，元素的可视化，但字段为空和person实例为null。

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

来源

2014-09-12 Fedy2

AngularDart的新版本（0.14.0）对于聚合物镖支持绑定（http://blog.angulardart.org）。目前可以有一些问题，不同的版本： Pub get failed, [1] Resolving dependencies... Incompatible version constraints on code_transformers

来源

2014-09-12 12:14:46 grohjy

我试过用这种方式使用聚合物元素：获得相同的异常。 – Fedy2 2014-09-12 13:13:05

你可以找到例子在

也看看在sept15-prg分支相同的文件。

新的语法似乎是像

<person-element bind-person="person"></person-element>

有可能释放角版本尚不支持此示例中使用的一些东西。

来源

2014-09-16 05:23:51

https://github.com/angular/angular.dart/blob/master/example/web/文件夹中的纸张示例使用通过bower_components文件夹下的bower安装的已安装纸张元素。我可以使用paper_elements包（https://pub.dartlang.org/packages/paper_elements）中的相同组件吗？ – Fedy2 2014-09-16 06:14:11

对不起，我错过了。我猜不会。您可以尝试使用来自'src/some-element'子文件夹的'paper_elements'包中的元素。这是原始的JS文件元素。 – 2014-09-16 06:17:42

飞镖中的角度和聚合物之间的对象绑定

回答

相关问题