Compare 2 objects

Question

Compare 2 objects

Navigation

#1 by (1 votes)

0

In my app.js

var variable = {tipo: 2, variables: [20, 35, 50] };
$scope.test = variable;
$scope.test2 = angular.copy(variable);

In my index.html

<input type="number" ng-model="test.tipo" />
<input type="number" ng-model="test2.tipo" />

<div ng-repeat="var in variables">
  <input type="number" ng-model="test.variables[$index]" />
  <input type="number" ng-model="test2.variables[$index]" />
</div>

<textarea ng-required=""></texarea>

How can I make the textarea mandatory, if for example the value of test2.tipo I change it to a 3 , but if I change it back to 2 is no longer mandatory?

Any suggestions?

angularjs

asked by sirdaiz 21.03.2017 в 13:36

source

1 answer

How can I run my local server with a specific path with PHP? show only days without saturdays, Sundays and holidays

score 1 · Accepted Answer

I think I do not understand your question very well, but I will try to guide you on how to make the textarea be required or not depending on some parameters. In your question you say:

How can I make the textarea mandatory, if for example, the value of test2.tipo I change it to a 3 , but if I change it back to 2 is no longer mandatory.

What I understand from the previous question is that you want the textarea to be required if the value of test2.tipo is unequal of 2.

Therefore the menarea of achieving it would be:

<textarea ng-required="test2.tipo != 2"></textarea>

However, guiding me by the title of your question:

Compare 2 objects

I guess what you want is to compare the value of the tipo parameter in the two objects. For example, the following code places the parameter required in the textarea only if the parameters tipo of the two objects are different, if they are equal it is no longer required:

Vista:

<div ng-app="myApp">

    <div ng-controller="myController">

        <input type="number" ng-model="test1.tipo" />
        <input type="number" ng-model="test2.tipo" />

        <textarea ng-required="test1.tipo != test2.tipo" ng-class="{'required': test1.tipo != test2.tipo}"></textarea>

    </div>

</div>

Driver:

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

app.controller("myController", ["$scope", function ($scope) {

    $scope.test1 = {tipo: 2, variables: [20, 35, 50] };
    $scope.test2 = angular.copy($scope.test1);

}]);

Here is a functional jsfiddle with the previous code.

EDIT: Following your last comment, what you want is to compare two objects completely and if they are not equal then place the parameter required in textarea . The best way to achieve this is to use the function angular.equals that you can use to compare two objects or two values. The technique I have used is to call a method in $scope that updates the variable arequal whenever I want it (in this case I update it every time the values of inputs are changed).

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

app.controller("myController", ["$scope", function($scope) {

  $scope.areequal = true;
  $scope.test1 = {tipo: 2, variables: [20, 35, 50]};
  $scope.test2 = angular.copy($scope.test1);

  $scope.compare = function() {
    $scope.areequal = angular.equals($scope.test1, $scope.test2);
  };

}]);

.required {
  border-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="myController">
    <input type="number" ng-model="test1.tipo" ng-change="compare()" />
    <input type="number" ng-model="test2.tipo" ng-change="compare()" />
    <br>
    <br>
    <textarea ng-required="!areequal" ng-class="{'required': !areequal}"></textarea>
  </div>
</div>