Question

我尝试从复选框列表中格式化动态json结果但没有成功。

JS：

var app = angular.module('app',[]);

app.controller('AuthorsCtrl', function($scope){

  $scope.users = [
    {'id':1,'name':'julien'},
    {'id':2,'name':'laurent'}
  ];

  $scope.authors = {};

});

HTML

  <label ng-repeat="user in users">
    <input type="checkbox" value="{{user.name}}" ng-model="authors[user.name]">{{user.name}}
  </label>

  <div>
    <h4>JSON result</h4>
    {{authors}}
  </div>

  <div>
    <h4>Result wanted</h4>
    julien & laurent OR julien OR laurent
  </div>

</body>

所以现在，我得到一个Json结果，我想用字符串值格式化。

感谢您的帮助!!!

Answer 1

格式化一个字符串，我认为角度最快的方法是过滤器，我给你一个快速而又脏的版本（http://plnkr.co/edit/05yyKz?p=preview）：

.filter('toText', function(){
  return function(jsonRaw){
    if(jsonRaw){
      andVal=[]
      for(var i in jsonRaw){
        if(jsonRaw[i])
          andVal.push(i);
      } 
      return andVal.join(' & ');
    }
  }
})

它需要一个带有{value：true / false}的JSON输入（来自复选框的标准输出），然后对于每个真值，它创建一个带有＆amp;的字符串。和OR（除非只选择了一个框）导致所需的输出

要调用它，你只需要管它：

{{authors | toText}}

同样的事情可以在控制器中的一个函数中完成，结果是相同的，但具有较少的可移植性

玩得开心

Answer 2

对模板进行一点改动

<label ng-repeat="user in users">
  <input type="checkbox" value="{{user.name}}" ng-model="user.checked">{{user.name}}
</label>

<div>
  <h4>JSON result</h4>
  {{users | myFilter}}
</div>

过滤器：

app.filter('myFilter', function(){
  return function(data){
    return data.filter(function(p){
      return p.checked;
    }).map(function(p){
      return p.name;
    }).join(" & ") || "none"
  }
})

初始化（或获取）模型时，添加checked属性：

$scope.users = [
  {'id':1,'name':'julien' , 'checked':true },
  {'id':2,'name':'laurent', 'checked':false},
  {'id':3,'name':'john'   , 'checked':false}
];

AngularJS - 格式复选框列表json结果

2 个答案: