Какая разница между @observable и @published в polymer.dart?

В файле polymer.dart, если вы хотите выставить переменную, определенную в контроллере, стороне представления, вы определяете переменную с помощью @observable и используйте двойные усы для вставки этой переменной. Однако в некоторых документах и ​​учебниках используется @published для достижения той же цели. Официальные документы также используют оба, поэтому я не думаю, что @published является устаревшим и устаревшим способом определения переменных.

Так есть ли разница между этими двумя? И какой я должен использовать в своем коде?

Ответ 1

@published - двусторонняя привязка (модель для просмотра и просмотра модели)

Использовать случай для @published, если ваше свойство модели также является атрибутом в теге.

Пример. Для элемента таблицы, который вы хотите предоставить данные из внешнего источника, поэтому вы определяете данные атрибута, в этом случае свойство данных должно быть @published.

<polymer-element name = "table-element" attributes ="structure data">
     <template>
         <table class="ui table segment" id="table_element">
             <tr>
                 <th template repeat="{{col in cols}}">
                     {{col}}
                 </th>
             </tr>
             <tr template repeat="{{row in data}}">
              etc......
     </template>
<script type="application/dart" src="table_element.dart"></script>
</polymer-element>


@CustomTag("table-element")
class Table extends PolymerElement {

 @published  List<Map<String,String>>  structure; // table struture column name and value factory
 @published List<dynamic> data; // table data

@observable - односторонняя привязка - (для просмотра модели)

Если вы просто хотите передать данные из модели для просмотра, используйте @observable

Пример. Чтобы использовать элемент выше таблицы, я должен предоставить данные, в этом случае данные и структура будут наблюдаться в моем тестовом тэге кода таблицы.

<polymer-element name = "table-test">
 <template>
     <search-box data ="{{data}}" ></search-box>
     <table-element structure ="{{structure}}" data = "{{data}}" ></table-element>
 </template>
<script type="application/dart" src="table_test.dart"></script>
</polymer-element>

код дротика

CustomTag("table-test")
class Test extends PolymerElement {

  @observable List<People> data = toObservable([new People("chandra","<a href=\"http://google.com\"  target=\"_blank\"> kode</a>"), new People("ravi","kiran"),new People("justin","mat")]);
  @observable List<Map<String,String>> structure = [{ "columnName" : "First Name", "fieldName" : "fname"},
                                                     {"columnName" : "Last Name", "fieldName" : "lname","cellFactory" :"html"}];
  Test.created():super.created();

Примеры взяты из My Repo