Example for stackoverflow. Dynamic Expression

useFormError is a angularjs directive, which is designed to create custom checks

by Stepan Kasyanenko

HTML

<script src="https://cdn.rawgit.com/Stepan-Kasyanenko/use-form-error/master/src/use-form-error.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-messages.min.js"></script>
<div ng-app="ExampleApp">
  <div ng-controller="ExampleController">
    <h3>
      ExampleController
    </h3>
    <form name="ExampleForm" id="ExampleForm">
      <div ng-repeat="item in items">
        <div ng-if="!item.expression">
          {{item.fieldName}} <input ng-model="item.value">
          <my-ng-model n-name="{{item.fieldName}}" n-value="item.value" obj="obj"></my-ng-model>
        </div>
      </div>
      <div ng-repeat="eval in evals">
        {{eval.expression }}={{$eval(eval.expression,obj)}}
      </div>
    </form>
  </div>
</div>

CSS

.errors {
  color: maroon
}

JavaScript

angular.module('ExampleApp', ['use', 'ngMessages'])
  .controller('ExampleController', function($scope, $parse) {
    $scope.obj = {};
    $scope.items = [{
      fieldName: "fname1",
      value: 2
    }, {
      fieldName: "fname2",
      value: 5
    }, {
      fieldName: "fname3",
      value: 4
    }, {
      fieldName: "fname4",
      value: 6
    }, {
      fieldName: "fname5",
      value: 3
    }, {
      fieldName: "subTotal1",
      expression: "fname1 + fname2 +fname3 +fname4 +fname5"
    },{
      fieldName: "subTotal2",
      expression: "fname1 + fname2 -fname3 +fname4 -fname5"
    }];
    $scope.evals = [];
    angular.forEach($scope.items, function(item) {
      if (item.expression) {
        $scope.evals.push({
          expression: item.expression
        });
      }
    });
  }).directive('myNgModel', function() {
    var root = {
      restrict: "E",
      replace: true,
      scope: {
        nName: "@",
        nValue: "=",
        obj: "="
      },
      link: function(scope) {
        scope.obj[scope.nName] = scope.nValue * 1;
        scope.$watch('nValue', function(value) {
          scope.obj[scope.nName] = value * 1;
        });
      }
    }
    return root;
  });