добавление значений из поля ввода в наблюдаемый массив и отображение его (knockout.js)

Это моя первая попытка на некоторых нокаутах. Существует поле ввода, и значение, которое вы записываете в него, получает «отправлено» в список и отображается. Однако это не работает, и я предполагаю, что это связано с тем фактом, что this.prodname не ассоциируется с наблюдаемым массивом. Но я не могу понять, как это сделать.добавление значений из поля ввода в наблюдаемый массив и отображение его (knockout.js)

Мой код:

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="jquery-1.10.2.min.js"></script> 
     <script type="text/javascript" src="knockout-3.0.0.js"></script> 
     <script type="text/javascript" src="app.js"></script> 
     <link rel="stylesheet" type="text/css" href="lt.css"/> 
     <title>eins</title> 
    </head> 
    <body> 
     <div id="main"> 
     <form data-bind="submit:addValues"> 
      <input type="text" data-bind="value:newprod, valueUpdate='afterkeydown'"></input> 
      <input type="text" data-bind="value:number,valueUpdate='afterkeydown'"></input> 
      <button type="submit">OK</button> 
     </form> 
      <ul data-bind="foreach:productname"> 
      <li data-bind="text : $index"></li> 
       <li data-bind="text:prodname"></li> 
       <li data-bind="text:anzahl"></li> 
      </ul> 
     </div> 
    </body> 
</html>

И app.js

$(document).ready(function() { 

    var mymodel = function() { 

     this.newprod = ko.observable(""); 
     this.productname = ko.observableArray(""): 

     this.addValues = function() { 
      this.productname.push(this.newprod()); 
     }; 

    }; 
    ko.applyBindings(new mymodel()); 
});

Я попробовал это, тоже:

this.productname.push({newprod: this.newprod() });

После прочтения этого поста: https://stackoverflow.com/questions/19419438/adding-an-item-to-an-observablearray-in-knockoutjs-when-using-mapping

Что касается Насколько я могу сказать, мой код напоминает этот пример: http://knockoutjs.com/examples/betterList.html

Однако, я не хочу, чтобы наблюдаемый массив был предварительно заполнен. Я хочу, чтобы значения поступали из поля ввода.

Thanx для вашей помощи!

источник

2014-01-24 user2791739

Вы могли бы сделать это таким образом (see fiddle)

Ваш код не работает, потому что в списке data-bind="foreach:productname", что вы имели, вы пытаетесь связать со свойствами вашей ViewModel (один экземпляр) вместо свойств/наблюдаемые массивом, который вы хотели перебрать. Были и некоторые другие вещи, такие как data-bind="text:prodname", но нет prodname был определен в любом месте вашей модели. Я очистил его для вас, и, надеюсь, вы сможете адаптировать этот код для удовлетворения ваших потребностей.

var mymodel = function() { 
    var self = this; 
    self.newprod = ko.observable(); 
    self.anzahl = ko.observable(); 
    self.productname = ko.observableArray(); 

    self.addValues = function() { 
     self.productname.push(new product(self.newprod(), self.anzahl())); 

     // clear the input boxes for the next entry 
     self.newprod(''); 
     self.anzahl(''); 
    }; 
}; 

function product(name, anz){ 
    var self = this; 
    self.newproduct = ko.observable(name); 
    self.anzahl = ko.observable(anz); 
} 

ko.applyBindings(new mymodel());

и HTML

<div id="main"> 
    <form data-bind="submit:addValues"> 
     <input type="text" data-bind="value:newprod"></input> 
     <input type="text" data-bind="value:anzahl"></input> 
     <button type="submit">OK</button> 
    </form> 
    <ul data-bind="foreach:productname"> 
     <li data-bind="text: $index() + 1"></li> 
     <li data-bind="text: newproduct"></li> 
     <li data-bind="text: anzahl"></li> 
    </ul> 
</div>

источник

2014-01-24 14:11:47 rwisch45

Ааа, Allright, мне нужно передать новый объект в нажимной методом ... теперь я это вижу. Большое спасибо!! – user2791739

добавление значений из поля ввода в наблюдаемый массив и отображение его (knockout.js)

ответ

Смежные вопросы