标签: checklist-model

在ng-repeat中检查AngularJS复选框

我知道解决方案不是很漂亮,但是我正在使用的模板需要它.

现在它可以工作,当产品在列表中时,它会向我显示"已添加"的span元素.

<section ng-repeat="product in products">
    <label>
        <input type="checkbox" 
            checklist-model="foobar.products" 
            checklist-value="product.id">
        {{ product.name }}
    </label>

    <div ng-repeat="current_item in my.profile.items">
        <span ng-show="product.id==current_item.id">Added</span>
    </div>
</section>
Run Code Online (Sandbox Code Playgroud)

我想要的是,当复选框后面还出现"已添加"文本时,选中要选中的复选框.

我试过这样做:

<ng-checked="{{my.profile.items.array.thing}}">
Run Code Online (Sandbox Code Playgroud)

但那不起作用.因为数组中的产品如:

[{       
    id: 1, name:"Trinity",
    id: 2, name:"Van Gogh",
    id: 3, name:"Bonaqua",
}]
Run Code Online (Sandbox Code Playgroud)

my.profile.items是一个包含更多信息的数组.因为它是我存储它的多对多关系.

有没有办法做到这一点?我不介意一个肮脏的解决方案:P

我试过这个:

// NG-check function
$scope.checkStoredValues = function(my) {

    // Loop trought my current stored items
    angular.forEach(my.profile.items, function(value, key) {

        // Loop trough the array    
        angular.forEach(value, function(value, key) {
            console.error(key);

            // If key == 'id'
            if(key == 'id'){ …
Run Code Online (Sandbox Code Playgroud)

angularjs checklist-model

8
推荐指数
1
解决办法
2万
查看次数

如何获取基于模型初始化的复选框?

我正在编写我的第一个非教程angular.js网络应用程序.我正在使用两个智能表和清单模型.下面是一个使用第一个st-safe-srcall_types是看起来像这样JSON对象的数组...

[
  {
    "_id": "56417a9603aba26400fcdb6a",
    "type": "Beer",
    "__v": 0
  },
  {
    "_id": "56456140cb5c3e8f004f4c49",
    "type": "Skiing",
    "__v": 0
  },
  ...
Run Code Online (Sandbox Code Playgroud)

这是我用来显示这些数据的表的html:

  <table st-table="displayedCollection" st-safe-src="all_types" class="table table-striped">
      <thead>
          <tr>
              <th st-sort="type">Types</th>
          </tr>
      </thead>
      <tbody>
          <tr ng-repeat="x in displayedCollection">
              <td><input type="checkbox" checklist-model="vendor.types" checklist-value="x.type">{{x.type}}</td>
          </tr>
          <tr><td>id ({{curid}}) {{vendor.types}}</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>
Run Code Online (Sandbox Code Playgroud)

当我将数据加载到其中时,此表看起来像这样.选中复选框以匹配我的模型中的数据.

在此输入图像描述

但是当我尝试在第二个智能表中做同样的事情时,更完整的json对象看起来像这样......

[
  {
    "_id": "569f047dd90a7874025b344e",
    "product_title": "Plugs",
    "product_img_001": "p001.jpg",
    "product_img_002": "p002.jpg",
    "product_vid_001": "bp.mov",
    "__v": 0,
    "product_sizes": [ …
Run Code Online (Sandbox Code Playgroud)

javascript json angularjs smart-table checklist-model

7
推荐指数
1
解决办法
1031
查看次数

如何为AngularJS表单验证要求至少一个带有清单模型的复选框?

我有一个带有2个日期输入和一个清单的小表单,这些都是复选框.我无法弄清楚如何在列表中要求任何一个复选框进行表单验证.如果我为复选框添加了ng-required,则会为所有复选框重复该操作.任何人都可以知道如何要求复选框作为必需的表单元素.但我不想选择所有元素来使表格有效.因此,如果只有一个作为复选框的表单字段被选中,则表单必须有效,否则无效.

angular.module('frmApp', [
    'ui.bootstrap', 'angularMoment'
  ])
  .controller('Frm Controller', [
    '$scope',
    function($scope) {

      $scope.invDets = $stateParams.details;
      $scope.allowanceObj = {};
      $scope.finCompWithLogo = [];

      $scope.validUntil = new Date();
      $scope.recentDate = new Date();

      // Disable weekend selection
      $scope.disabled = function(date, mode) {
        return (mode === 'day' && (date.getDay() === 0 || date.getDay() === 6));
      };
      $scope.openedPayment = false;
      $scope.openedAllowance = false;
      $scope.openPayment = function($event, elementOpened) {
      	$scope.paymentDueDate = new Date();
        /*$scope.openedPayment = !$scope.openedPayment;*/
        $event.preventDefault();
        $event.stopPropagation();

        $scope[elementOpened] = !$scope[elementOpened];
      };
      $scope.openAllowance = function($event, elementOpened) { …
Run Code Online (Sandbox Code Playgroud)

validation angularjs angularjs-directive angularjs-scope checklist-model

2
推荐指数
1
解决办法
4243
查看次数