如何从 smart-table 插件获取数据?

How to get data from smart-table plugin?

我正在尝试调整如何使用带有 smart-table 的自定义插件的示例。请参阅 http://lorenzofox3.github.io/smart-table-website/

的 "Create your own plugin" 部分

到目前为止,这是我的网络应用程序的屏幕截图:

我遇到的问题是我不知道如何从 smart-table 中获取项目 select。 smart-table 上的 selected 项目是 "Beer" 和 "Mountain Biking"。这是我的 app.js 文件:

var app = angular.module("app", ['smart-table']);

app.directive('csSelect', function () {
    return {
        require: '^stTable',
        template: '<input type="checkbox"/>',
        scope: {
            row: '=csSelect'
        },
        link: function (scope, element, attr, ctrl) {

            element.bind('change', function (evt) {
                scope.$apply(function () {
                    ctrl.select(scope.row, 'multiple');
                });
            });

            scope.$watch('row.isSelected', function (newValue, oldValue) {
                if (newValue === true) {
                    element.parent().addClass('st-selected');
                } else {
                    element.parent().removeClass('st-selected');
                }
            });
        }
    };
});

这是我的控制器:

app.controller("vendorCtrl", function($scope,$http) {
    $scope.vendor_to_look_for = "";
    $scope.newvendor = "";
    $scope.newlogo = "";
    $scope.vendors_types = [];

    $scope.itemsByPage=5;
    $http.get("http://192.168.1.115:8080/vendor").then(function(response) {
        $scope.all_vendors = response.data;
    });
    $http.get("http://192.168.1.115:8080/type").then(function(response) {
        $scope.all_types = response.data;
    });


    $scope.submit_vendor  = function() {
        // alert("add new vendor [" + $scope.newvendor + "]" );
        var data = $.param({ vendor_name: $scope.newvendor, vendor_logo: $scope.newlogo, vendors_types: $scope.vendors_types });
        $http.post("http://192.168.1.115:8080/vendor/add",
            // [{'vendor': $scope.newvendor}],
            data,
            {headers: {'Content-Type': 'application/x-www-form-urlencoded'}}).then(function(response) {
            console.log(response);
            console.log(response.data);
        });
        $http.get("http://192.168.1.115:8080/vendor").then(function(response) {
            console.log(response);
            console.log(response.data);
            $scope.all_vendors = response.data;
        });
    };
});

更新:这是相关的HTML:

<form ng-submit="submit_vendor()">
      <table>
      <tr><td><label>Vendor name</label></td><td><input type="text" ng-model="newvendor" placeholder="Name"></td></tr>
      <tr><td><label>Logourl</label></td><td><input type="text" ng-model="newlogo" placeholder="Url"></td></tr>
      </table>
      <table st-table="displayedCollection" st-safe-src="all_types" class="table table-striped">
          <thead>
              <tr>
                  <th st-sort="type">Select</th>
                  <th>Type</th>
              </tr>
          </thead>
          <tbody>
              <tr ng-repeat="x in displayedCollection">
                  <td cs-select="x"></td>
                  <td>{{x.type}}</td>
              </tr>
          </tbody>
          <tfoot>
              <tr>
                  <td colspan="5" class="text-center">
                      <div st-pagination="" st-items-by-page="itemsByPage" st-displayed-pages="7"></div>
                  </td>
              </tr>
          </tfoot>
      </table>
      <button type="submit" class="btn btn-success btn-lg btn-block"><span class="glyphicon glyphicon-flash"></span> Add </button>
</form>

当我单击添加按钮时,我的 submit_vendor() 函数会执行,但我传入的 vendor_types 表单数据为空。如何将 table 中编辑的 select 项目添加到我的表单数据中?

谢谢!

我找到了这个https://github.com/vitalets/checklist-model 这让事情变得容易多了。我不需要声明我的 csSelect 指令 :)