Пример AngularJS в backbone.js и/или Knockout.js

Я сравниваю эти фреймворки, чтобы сделать некоторые расчеты на стороне клиента. Мне очень понравился пример на сайте AngularJS. Мне было интересно, может ли кто-нибудь из экспертов по backbone.js или Knockout.js на сайте воссоздать этот пример в своих соответствующих фреймворках.

Вот JSFiddle для него .

Код скрипки:

<table ng:init="invoice= {items:[{qty:10, description:'gadget', cost:9.95}]}">
  <tr>
    <th>Qty</th>
    <th>Description</th>
    <th>Cost</th>
    <th>Total</th>
    <th></th>
  </tr>
  <tr ng:repeat="item in invoice.items">
    <td><input name="item.qty" value="1" size="4" ng:required ng:validate="integer"></td>
    <td><input name="item.description"></td>
    <td><input name="item.cost" value="0.00" ng:required ng:validate="number" size="6"></td>
    <td>{{item.qty * item.cost | currency}}</td>
    <td>[<a href ng:click="invoice.items.$remove(item)">X</a>]</td>
  </tr>
  <tr>
    <td><a href ng:click="invoice.items.$add()">add item</a></td>
    <td></td>
    <th>Total:</th>
    <td>{{invoice.items.$sum('qty*cost') | currency}}</td>
  </tr>
</table>

<!-- 
  Workaround for jsfiddle to pass in ng:autobind
  http://doc.jsfiddle.net/basic/introduction.html#css
-->
<script src="http://code.angularjs.org/angular-0.9.10.min.js" ng:autobind></script>

<style>
table th {
  font-weight: bold;
}
table td {
  padding: 0.3em;
}

person aa_memon    schedule 07.03.2011    source источник
comment
кто-нибудь из сообщества backbone.js хочет попробовать, пожалуйста. был бы очень признателен.   -  person aa_memon    schedule 22.03.2011


Ответы (2)


Вот вам нокаут >

http://jsfiddle.net/neebz/YbwzJ/

Я могу быть предвзятым, но это гораздо более структурно, чем угловой/основной.

Если у вас есть какие-либо вопросы, дайте мне знать.

Есть несколько проверок NaN, которые, я думаю, вы могли бы взять сами.

person neebz    schedule 07.03.2011
comment
это было быстро, спасибо. я не упомянул об этом, потому что пример angular имел смысл для меня (настоящего начинающего программиста), я могу сравнить фреймворки и выбрать один для начала. еще раз спасибо - person aa_memon; 07.03.2011
comment
одна область, в которой нокаут действительно теряет основу или угловатость, - это проверка, и в вашем примере у вас ее также нет. - person sha1dy; 12.05.2011
comment
это правда. Я обычно использую плагин проверки jQuery для проверки вместе с Knockoutjs. - person neebz; 12.05.2011
comment
скрипка не загружается (в Chrome: ko не определено), и ИМХО нокаут слишком многословен - person Qrilka; 13.11.2011
comment
@nEEbz, вам следует серьезно попробовать angular.. Структура и лаконичность кода действительно очевидны.. - person ganaraj; 30.05.2012
comment
:( учебник по jsfiddle не работает - person Chase Florell; 28.01.2013
comment
это исправлено под другой скрипкой? Потому что тот, который вы отправили, все еще выдает ошибку. - person Chase Florell; 29.01.2013
comment
@ChaseFlorell: очевидно, jsfiddle разветвил его › jsfiddle.net/neebz/YbwzJ/46 - person neebz; 29.01.2013

Также посмотрите https://github.com/addyosmani/todomvc, где показано стандартное приложение TODO, написанное во всех популярных фреймворках.

person Misko Hevery    schedule 14.09.2011