Question

我有以下Knockout编码：

        <form action='/someServerSideHandler'>
            <p>You have asked for <span data-bind='text: citys().length'>&nbsp;</span> city(s)</p>
            <table data-bind='visible: citys().length > 0'>
                <thead>
                    <tr>
                        <th>Id</th>
                        <th>Name</th>
                        <th />
                    </tr>
                </thead>
                <tbody data-bind='foreach: citys'>
                    <tr>
                        <td>
                            <input class='required' data-bind='value: CityId' /></td>
                        <td>
                            <input class='required' data-bind='value: Name' /></td>
                        <td>
                            <input class='required' data-bind='value: Description' /></td>
                        <td><a href='#' data-bind='click: $root.removeGift'>Delete</a></td>
                    </tr>
                </tbody>
            </table>

            <button data-bind='click: addCity'>Add City</button>
            <button data-bind='enable: citys().length > 0' type='submit'>Submit</button>
        </form>

我想将此转移到AngularJS，但我不知道从哪里开始。你可以看到它是一个非常简单的网格。这就是我需要的一切。我不需要ng-grid的复杂性。

有没有人看过我可以用来帮助我将上述内容转换为AngularJS网格的任何教程或简单网格示例？

还有一个小问题。我研究了使用ng-grid但是让我使用它的东西是它需要jQuery的大小和事实。有谁知道如果我没有jQuery会发生什么，它还能运作吗？还有什么是ng-grid的最小尺寸。我刚注意到一个下载就像说800K！

Answer 1

从Knockout转换为Angular非常容易。他们几乎在视图中使用相同的概念。

这是相同的html（如上所述），但转换为Angular。

<form action='/someServerSideHandler'>
  <p>You have asked for {{citys.length}} city(s)</p>
  <table ng-show="citys.length > 0">
      <thead>
          <tr>
              <th>Id</th>
              <th>Name</th>
              <th />
          </tr>
      </thead>
      <tbody>
          <tr ng-repeat="city in citys">
              <td>
                  <input class='required' ng-model="city.cityId" /></td>
              <td>
                  <input class='required' ng-model="city.Name" /></td>
              <td>
                  <input class='required' ng-model="city.Description" /></td>
              <td><a href='#' ng-click="removeGift()">Delete</a></td>
          </tr>
      </tbody>
  </table>

  <button ng-click="addCity()">Add City</button>
  <button ng-disable="!citys.length" type='submit'>Submit</button>
</form>

AngularJS有关于如何创建简单网格的任何好教程吗？

1 个答案: