এটি উত্তর দেওয়ার মতো লোমশ, কারণ আপনি যা করছেন তার পুরো প্রসঙ্গটি আপনি দেন নি। গৃহীত উত্তরটি কাজ করবে তবে কিছু ক্ষেত্রে খারাপ পারফরম্যান্সের কারণ হবে। এটি, এবং এটি পরীক্ষা করা আরও কঠিন হতে চলেছে।
আপনি যদি এটি একটি স্ট্যাটিক ফর্মের অংশ হিসাবে করছেন তবে ঠিক আছে। গৃহীত উত্তরটি কার্যকর হবে, এমনকি এটি পরীক্ষা করা সহজ না হলেও এবং এটি হিনকি।
আপনি যদি এই সম্পর্কে "কৌণিক" হতে চান:
আপনি যে কোনও "ব্যবসায়িক যুক্তি" (অর্থাত্ যুক্তি প্রদর্শিত হবে যা ডেটা প্রদর্শিত হতে পারে) আপনার দৃষ্টিভঙ্গির বাইরে রাখতে চাইবেন। এটি তাই আপনি আপনার যুক্তি পরীক্ষা করতে পারেন এবং যাতে আপনি আপনার নিয়ামক এবং আপনার দৃশ্যের জোড় জোড় করে শেষ করবেন না। তাত্ত্বিকভাবে, আপনার নিয়ামকটিকে অন্য দর্শনে দেখানো এবং স্কোপগুলি থেকে একই মানগুলি ব্যবহার করতে সক্ষম হওয়া উচিত। (যদি তা বোঝা যায়)
আপনি এটিও বিবেচনা করতে চাইবেন যে কোনও বাঁধার অভ্যন্তরের যে কোনও ফাংশন কলগুলি (যেমন {{}}বা ng-bindবা ng-bind-html) প্রতিটি ডাইজেস্টের উপর মূল্যায়ন করতে হবে , কারণ কৌণিকের জানার কোনও উপায় নেই যে কোনও মানের সাথে এটির পরিবর্তন হয়েছে কি না তা পছন্দ করে knowing সুযোগ এ।
এটি করার "কৌণিক" উপায়টি হ'ল এনজি-চেঞ্জ ইভেন্ট বা এমনকি একটি ঘড়ি ব্যবহার করে পরিবর্তনের সুযোগের কোনও সম্পত্তিতে থাকা মূল্যকে ক্যাশে করা।
একটি স্থির ফর্ম সহ উদাহরণস্বরূপ:
angular.controller('MainCtrl', function($scope, $window) {
$scope.count = 0;
$scope.total = 1;
$scope.updatePercentage = function () {
$scope.percentage = $window.Math.round((100 * $scope.count) / $scope.total);
};
});
<form name="calcForm">
<label>Count <input name="count" ng-model="count"
ng-change="updatePercentage()"
type="number" min="0" required/></label><br/>
<label>Total <input name="total" ng-model="total"
ng-change="updatePercentage()"
type="number" min="1" required/></label><br/>
<hr/>
Percentage: {{percentage}}
</form>
এবং এখন আপনি এটি পরীক্ষা করতে পারেন!
describe('Testing percentage controller', function() {
var $scope = null;
var ctrl = null;
//you need to indicate your module in a test
beforeEach(module('plunker'));
beforeEach(inject(function($rootScope, $controller) {
$scope = $rootScope.$new();
ctrl = $controller('MainCtrl', {
$scope: $scope
});
}));
it('should calculate percentages properly', function() {
$scope.count = 1;
$scope.total = 1;
$scope.updatePercentage();
expect($scope.percentage).toEqual(100);
$scope.count = 1;
$scope.total = 2;
$scope.updatePercentage();
expect($scope.percentage).toEqual(50);
$scope.count = 497;
$scope.total = 10000;
$scope.updatePercentage();
expect($scope.percentage).toEqual(5); //4.97% rounded up.
$scope.count = 231;
$scope.total = 10000;
$scope.updatePercentage();
expect($scope.percentage).toEqual(2); //2.31% rounded down.
});
});
<p>The percentage is {{(100*count/total)| number:0}}%</p>নীচের মন্তব্যে আরও কিছু।