如何從Ember.TextField的視圖內的HTML變量切換值？

我一直在想如何在Ember.js是可以改變一個值從HTML變量。我想要做的是當我點擊在編輯按鈕，我想更改只讀的值，並使其在文本字段中使用視圖Ember.TextField可讀。如何從Ember.TextField的視圖內的HTML變量切換值？

的代碼波紋管顯示：

<div id="list_container"> 
    <h2>Contacts:</h2> 
    <ul id="people_List"> 
    {{#each person in controller}} 
    <li {{bindAttr class='isEditing:red'}}> 
      <!-- here where Im trying to use the value to switch the value from a html variable --> 
      {{view Ember.TextField valueBinding="person.name" readonly='isEditing'}} 
      {{view Ember.TextField valueBinding="person.birthday" readonly='isEditing'}} 
      {{view Ember.TextField valueBinding="person.telephone" readonly='isEditing'}} 
      <button {{action edit}}>Edit</button> 
      <button {{action details}}>Details</button> 
      <button {{action remove}}>Remove</button> 
    </li> 
    {{/each}} 
    </ul> 
</div> 

Schedule.PeopleController = Ember.ArrayController.extend({ 
    itemController: 'Person' 
}); 

Schedule.PersonController = Ember.ObjectController.extend({ 
    isEditing: true, 
    edit : function() { 
     this.toggleProperty('isEditing'); 
     console.log(this.get('isEditing')); 
    }, 
    details : function() { 
     console.log("Details was clicked!!"); 
    }, 
    remove : function() { 
     console.log("Remove was clicked!!"); 
    } 
});

我避免使用：

{{if}} 
...HTML CODE... 
{{else}} 
...HTML CODE... 
{{/if}}

來源

2013-07-30 Danilo Santos

您應該綁定只讀屬性的文本框視圖。

您可以通過在車把

{{view Source.TextField valueBinding="person.name" readonlyBinding='isEditing'}} 
    {{view Source.TextField valueBinding="person.birthday" readonlyBinding='isEditing'}} 
    {{view Source.TextField valueBinding="person.telephone" readonlyBinding='isEditing'}}

創建擴展Ember.TextField

Source.TextField = Ember.TextField.extend({ 
     attributeBindings: ["readonly"] 
})

自定義文本框視圖這樣做或添加支持全球範圍內重新Ember.TextField或Ember.TextSupport。

Ember.TextSupport.reopen({ 
    attributeBindings: ["readonly"] 
})

，並在你的車把

{{view Ember.TextField valueBinding="person.name" readonlyBinding='isEditing'}} 
{{view Ember.TextField valueBinding="person.birthday" readonlyBinding='isEditing'}} 
{{view Ember.TextField valueBinding="person.telephone" readonlyBinding='isEditing'}}

其實

默認情況下Ember.TextField提供類型，值，大小，樣式，佔位符，殘疾人，最大長度和支持的tabindex屬性上一個文本字段。如果您需要支持更多屬性，則必須執行上述操作之一。

參考更多詳細信息

來源

2013-07-30 14:37:31 Hyder

在** readonlyBinding =「isEditing」 **可以反轉正被作爲參數傳遞的值？我的東西一直在思考這樣的：** readonlyBinding =「＃不isEditing」 ** –

我不知道，如果有這樣的事情，但你可以在你的itemController有一個計算的屬性，它會返回談判isEditing的，觀察isEditing，像'isNotEditing：函數（）{返回this.get（ 'isEditing'）！}財產（ 'isEditing'）'，並給作爲綁定爲只讀，如'readonlyBinding ='isNotEditing''。 – Hyder

的海德aswer是正確的this API文檔。另外這裏是一個Demo

只需提供attributeBindings: ["readonly"]，對你的看法。並且該屬性將響應更改。

來源

2013-07-30 14:48:50

如何從Ember.TextField的視圖內的HTML變量切換值？

回答

相關問題