重用AngularJS中的方法而不是定义多个变量

Question

我在angularjs中创建了一个示例应用程序。 我有不同的变量（colorNew和numberNew），它们保存了类似操作的值。 如何优化代码（创建方法），以便我可以重用我的angular.forEach以及代码中显示的split方法，而不是多次编写它们？

以下是代码：

＆＃13;

＆＃13;

angular.module('myApp', [])
  .controller('myCtrl', ['$scope', function($scope){
    $scope.myData = [
	  { 
	    'car': 'Ford',
	    'color': 'Black, White, Blue',
	    'number': '1, 2, 3',
	    'model': 'Figo'			  
	  }, { 
	    'car': 'Ford',
	    'color': 'Red, Black, Silver',
	    'number': '4,5',
	    'model': 'Endeavour'			  
	  },{ 
	    'car': 'Jaguar',
	    'color': 'White',
	    'number': '6',
	    'model': 'F-Type'			  
	  },
    ];
  
    $scope.getData = function(){
	  $scope.color = this.car.color.split(',');
	  $scope.number = this.car.number.split(',');
	  console.log($scope.color);
	  $scope.colorNew = angular.forEach($scope.color, function() {
		return $(this);
	  }).join(' | ');
	  $scope.numberNew = angular.forEach($scope.number, function() {
		return $(this);
	  }).join(' | ');
	  console.log($scope.colorNew);
	  console.log($scope.numberNew);
    };
}]);
			

＆＃13;

.parent {
  border: 1px solid lightgrey;
  border-radius: 5px;
  background-color: skyblue;
  height: 100px;
  margin-top: 5px;
  padding: 10px;			
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <button id="createData">Create Data</button>
  <div class="container">
	<div ng-repeat="car in myData" class="parent">
	  <div>
		<label>Car:</label>
		<span>{{car.car}}</span>
	  </div>
	  <br />
      <div>
		<label>Model:</label>
		<span>{{car.model}}</span>
	  </div>
	  <br />
	  <button ng-click="getData(obj)">Click Me!</button>
	</div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;