访问外部js中的ng-model值

时间:2016-11-22 22:33:40

标签: javascript angularjs string angularjs-scope

我需要以字符串格式保存ng-model值并在外部js.Below中使用它是代码。我无法以字符串格式保存它。

<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="style.css">
  <script src="script.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
  <script>
    var app = angular.module('appNew', []);
    app.controller('controllerNew', function($scope) {
      $scope.dataSet = ["A", "B", "C"];
      $scope.selectColor = null;
      //var colorString = "A,Green:B,Green:C,Red";
    });
    /* Below function getValues() is in external file. 
    I just need to pass selected dropdown from angular JS 
    to this below code in string format as shown below*/
    function getValues() {
    var colorString = "A,Green:B,Green:C,Red";
            colorString = colorString.split(":");
            var lengthColorString = colorString.length;
            var colorStringRed = [];
            var colorStringBlue = [];
            var colorStringGreen = [];
            for (i = 0; i < lengthColorString; i++) {
                var group = colorString[i].split(",");
                switch (group[1]) {
                    case "Red":
                        colorStringRed.push(group[0]);
                        break;
                    case "Blue":
                        colorStringBlue.push(group[0]);
                        break;
                    case "Green":
                        colorStringGreen.push(group[0]);
                }
            }
           alert(colorStringRed);
           alert(colorStringBlue);
           alert(colorStringGreen);
    };
  </script>
</head>

<body ng-app="appNew">
  <table class="table TableOne" ng-controller="controllerNew">
    <thead>
      <tr>
        <th>Serial</th>
        <th>Data</th>
        <th>Dropdown</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="data in dataSet">
        <td>{{$index + 1}}</td>
        <td>{{data}}</td>
        <td>
          <select ng-model="$parent.selectColor[data]">
            <option value="">-- Select --</option>
            <option value="Red">Red</option>
            <option value="Blue">Blue</option>
            <option value="Green">Green</option>
          </select>
        </td>
        <td>{{selectColor}}</td>
      </tr>
    </tbody>
    <button onclick="getValues()">Alert Values</button>
  </table>
</body>

</html>

这里$ scope.dataSet可以是任何长度,例如[&#34; A&#34;,&#34; B&#34;,&#34; C&#34;,&#34; D&#34 ;,&#34; E&#34;]。 有没有办法将范围内的值转换为字符串格式? 以下是Plunker链接: https://plnkr.co/edit/2MdwoWpu6MGrt2rA61io?p=preview

1 个答案:

答案 0 :(得分:0)

使用forEach遍历数组中的每个项目和concat以构建从第一个项目开始的所有项目的单个字符串。