2015-05-28 6 views
1

У меня есть значение, которое я получаю от контроллера и двух полей ввода. Мне нужно, чтобы всякий раз, когда я вводил любое значение в одном поле ввода. разница в значении, полученном от контроллера и в поле ввода, отображается в другом поле ввода с использованием угловых символов. например: - {{sum}} -> это значение, которое я получаю от контроллера.Динамические значения по умолчанию для поля ввода в angularJs

<input type="number" ng-model="firstnumber" /> 
<input type="number" ng-model="secondnumber"/> 

То, что я пытался делал сервис для установки и получения значения суммы и смотреть, чтобы изменить значение каждый раз, когда изменяется значение.

Моя служба: -

angular.module('myapp').service("cmModalService", function($scope){ 
var sum= ={}; 
    getSum = function(){ 
     return sum; 
    } 

    setSum = function(value){ 
     sum=value; 
    }; 
}); 

В контроллере я определил

$scope.$watch('firstnumber', function(newValue, oldValue) { 
var sum=cmModalService.getSum();  
if(newValue!=null) 
{ secondnumber = sum -firstnumber; 
} 
}); 

$scope.$watch('secondnumber', function(newValue, oldValue) { 
var sum=cmModalService.getSum();  
if(newValue!=null) 
{ firstnumber = sum -secondnumber; 
} 
}); 

Но всякий раз, когда я изменить значение в поле ввода поток никогда не идет смотреть метод, а значения Безразлично» t изменение. Есть ли другой способ достижения этого?

Я также попытался использовать ng-change, но все же не смог получить точный результат.

И внутри контроллера я определил методы изменения как

$scope.changefirstnumber=function(firstnumber, sum){ 
    $scope.secondnumber = sum- firstnumber; 
    }; 


    $scope.changesecondnumber=function(secondnumber, sum){ 
    $scope.firstnumber= sum- secondnumber; 
    }; 

и в HTML

[ссылка Plunker]

+0

почему не можешь просто сделать '{{firstnumber +}} второго числа'? – Ronnie

+1

Я не понимаю, вы хотите, чтобы вы заполнили еще один входной код суммой значений из других 2? – AndreaM16

+0

Я имею в виду, когда я вводим значение в поле ввода, значение в другом поле ввода shoul d автоматически появляется как {{sum-firstnumber}} и наоборот – Eftakhar

ответ

0

Вы не устанавливая контекстными переменную , Попробуй это.

$scope.$watch('firstnumber', function(newValue, oldValue) { 
var sum=cmModalService.getSum();  
if(newValue!=null) 
{ $scope.secondnumber = sum -$scope.firstnumber; 
} 
}); 

$scope.$watch('secondnumber', function(newValue, oldValue) { 
var sum=cmModalService.getSum();  
if(newValue!=null) 
{ $scope.firstnumber = sum - $scope.secondnumber; 
} 
}); 

Working Plunkr

+1

@pankajparkar - Спасибо за добавление plunkr. У меня не было возможности попробовать. – ShankarSangoli

+1

Он работает из-за предполагаемой логики в нем. В противном случае $ watch будет работать бесконечно, потому что один из часов изменяет значения других часов. – ShankarSangoli

+0

вот что я пытаюсь указать ... но это не получилось в этом сценарии ..: p –

0

EDIT С некоторой новой информации, предоставленной вами, это то, что вы после этого? http://jsfiddle.net/37gv1kbe/

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

app.controller('MyController', function($scope,cmModalService) 
{ 
    $scope.firstnumber = 5; 
    $scope.secondnumber = 10; 

    $scope.$watch('firstnumber', function() 
    { 
     $scope.total = cmModalService.getSum() - $scope.firstnumber 
    }); 

    $scope.$watch('secondnumber', function() 
    { 
     $scope.total = cmModalService.getSum() - $scope.secondnumber; 
    }); 
}); 

app.controller('MySecondController', function($scope,cmModalService) 
{ 
    $scope.rand = Math.round(Math.random() * 100); 
    cmModalService.setSum($scope.rand); 
}); 

app.service('cmModalService', function() 
{ 
    var sum; 
    return { 
     getSum: function() 
     { 
      return sum; 
     },  
     setSum: function(value) 
     { 
      sum = value; 
     }  
    } 
}); 

ОРИГИНАЛЬНЫЙ ОТВЕТ

относительно моего комментария, если вам нужно получить доступ к общей в контроллере, вы можете просто сохранить Вэл из firstnumber и secondnumber как так

http://jsfiddle.net/pvqm4tcw/

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

app.controller('MyController', function($scope) 
{ 
    $scope.firstnumber = 5; 
    $scope.secondnumber = 10; 

    $scope.$watch('firstnumber', function() 
    { 
     $scope.total = $scope.firstnumber + $scope.secondnumber; 
    }); 

    $scope.$watch('secondnumber', function() 
    { 
     $scope.total = $scope.firstnumber + $scope.secondnumber; 
    }); 
}); 

html:

<body ng-app="myApp"> 
    <div ng-controller="MyController"> 
     <input type="number" ng-model="firstnumber" /> 
     <br> 
     <input type="number" ng-model="secondnumber"/> 
     <br> 
     {{total}} 
    </div> 
</body> 

Если вы используете Угловой 1.3+ они имеют $watchGroup, которые могут сделать код еще меньше

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

app.controller('MyController', function($scope) 
{ 
    $scope.firstnumber = 5; 
    $scope.secondnumber = 10; 

    $scope.$watchGroup(['firstnumber','secondnumber'], function() 
    { 
     $scope.total = $scope.firstnumber + $scope.secondnumber; 
    }); 
}); 
+0

это не то, что я хочу – Eftakhar

+0

@Eftakhar вам нужно чтобы быть более ясным в вашем вопросе, то, более конкретно – Ronnie

+0

@Eftakhar, пожалуйста, см. мой обновленный ответ – Ronnie

Смежные вопросы