我如何在angularJS中的ng-repeat中将字符串值绑定

时间:2017-03-03 05:52:02

标签: angularjs angularjs-ng-repeat

这是我的代码,

 $scope.records = "test,Test1,Test2,test3,test4";

我想在li标签中将此值与ng-repeat.need输出绑定为

 .test
.Test1
.Test2
.Test3
.Test4

6 个答案:

答案 0 :(得分:2)

使用自定义过滤器。



angular.module('myApp', []);

var app= angular.module('myApp')
app.controller('MyController', MyController);
  app.filter('split', function() {
    return function(input, spliceplace) {
      var spliceplace = spliceplace || ',';

      return input.split(spliceplace);
    } 
  });

function MyController($scope) {

  $scope.records = "test,Test1,Test2,test3,test4";

};

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.10/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyController">
  <ul>
  <li ng-repeat="record in records | split">
  <!-- OR <li ng-repeat="record in records | split:','">-->
      {{record}}
    </li>
  </ul>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您可以使用split运算符将字符串拆分为,,然后您可以使用ng-repeat

angular.module('myApp', []);

angular.module('myApp').controller('MyController', MyController);

function MyController($scope) {

  $scope.records = "test,Test1,Test2,test3,test4";
  $scope.records = $scope.records.split(',');

};
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.10/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyController">
  <ul>
    <li ng-repeat="record in records">
      {{record}}
    </li>
  </ul>
</div>

答案 2 :(得分:0)

请检查工作plnkr是否符合您的要求http://plnkr.co/edit/cmY8S1nKYDBCa1GvmFh6?p=preview

<ui>
     <li ng-repeat="record in records" ng-bind="record"></li>
</ui>

答案 3 :(得分:0)

使用ng-bind

var app = angular.module("app", []);
app.controller("ctrl", function($scope) {
  $scope.records = ["test", "Test1", "Test2", "test3", "test4"];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <li ng-repeat="rec in records" ng-bind="rec">
    </li>
</div>

答案 4 :(得分:0)

找到你的答案:

<body>
  <div ng-app="App" ng-controller="mycontroller">
    {{records}} <br/>
    {{arrays}}<br />
    <ul>
      <li ng-repeat="array in arrays"> {{array}}</li>
    </ul>
  </div>
  <script type="text/javascript">
  var app = angular.module("App",[]);
  app.controller("mycontroller",function($scope){
      $scope.records = "test,Test1,Test2,Test3,Test4";
      $scope. arrays = $scope.records.split(',');
  })

  </script>

答案 5 :(得分:0)

首先将该字符串转换为数组,然后在li

中使用ng-repeat

请检查链接......

[Please check the link]

http://jsfiddle.net/manojbagale/jm0kvcmt/1/