飛鏢中的角度和聚合物之間的對象綁定

我試圖將一個角度受控元素的對象綁定到飛鏢中的聚合物元素。飛鏢中的角度和聚合物之間的對象綁定

目的結合：

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

飛鏢中的角度和聚合物之間的對象綁定

回答

相關問題