Значение привязки из Textfield при нажатии кнопки

StackOverflow https://stackoverflow.com/questions/8857017

  •  28-10-2019
  •  | 
  •  

Вопрос


У меня есть следующий пример (см. Ниже) для работы с Ember.js, и все работает хорошо, насколько я ввожу что -то в текстовое поле и нажимаю Enter. Но как я могу получить тот же результат, когда я нажимаю на кнопку? Как я могу связать значение текстового поля при нажатии на кнопку? У меня есть работа с видом?
Заранее спасибо!

<script type="text/x-handlebars">
  {{view App.TextField}}
  {{#view Ember.Button target="App.peopleController" action="addPerson"}}
    Add Person
  {{/view}}
  <ul id='todo-list'>
  {{#each App.peopleController }}
    <li>{{name}}</li>
  {{/each}}
  </ul>
</script>
<script>
  App = Em.Application.create();

  App.peopleController = Em.ArrayController.create({
    content: [{name: "Tom"}, {name: "Mike"}],

    addPerson: function(name) {
      this.unshiftObject(App.Person.create({name: name}));
    }
  });

  App.Person = Em.Object.extend({
    name: null
  });       

  App.TextField = Em.TextField.extend({
    insertNewline: function() {
      App.peopleController.addPerson(this.get("value"));
      this.set("value", "");
    }
  });
</script>
Это было полезно?

Решение

На самом деле это немного сложно, но я переработал ваш пример в JSFiddle: http://jsfiddle.net/ebryn/vdmra/

Я бы посоветовал против жестких ссылок на контроллеры в вашем просмотре подклассы. Вы не можете повторно использовать эти компоненты представления в другом месте, если вы это сделаете.

Другие советы

Я думаю, что в вашем коде для кнопки Ember просто будет вызов функции AddPerson, не давая ей параметр имени, который он ожидает. Возможно, вам придется написать отдельное представление для этой кнопки, чтобы получить значение поля ввода для передачи функции аддюрсона.

App.MyButton = Em.Button.extend({
  click: function(){
    var value = App.TextField.get('value')
    // etc

  }
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top