Как изменить единицы измерения с мм на дюйм или наоборот в angularjs для падения вниз выберите

BLOCKQUOTE мне нужно один раскрывающийся, где пользователь может выбрать любую единицу измерения (либо MM или Inches.toggle), так что если я выбрать значение mm, в моей нижней форме все вычисления должны быть выполнены в mm.it означает, что все значения должны отображаться в миллиметрах и рассчитываться в соответствии с единицей, выбранной при выпадении. например. длина, ширина и общая площадь всех будет будет отображаться и рассчитывается в ММ (основано на выпадающем меню выберите)Как изменить единицы измерения с мм на дюйм или наоборот в angularjs для падения вниз выберите

<!DOCTYPE html> 
 
<html> 
 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<body> 
 
    <div ng-app="myapp" ng-controller="MainCtrl"> 
 
<p>Select a unit:</p> 
 
<select ng-model="selectedunit" ng-options="x for (x, y) in unit"> 
 
    </select> 
 
    <form data-ng-repeat="choice in choices"> 
 
    Length:<input type="number" ng-model="choice.length" /> 
 
    width: <input type="number" ng-model="choice.width" /> 
 
    Area: <input id="area" type="number" placeholder="Area" value="{{ choice.length * choice.width }}" /> 
 
    <button ng-show="$last" ng-click="removeChoice()">-</button> 
 

 
    </form> 
 
    
 
    <button ng-click="addNewChoice()">Add fields</button> 
 
    Result : {{ sum() }} 
 
</div> 
 
    
 
    <script> 
 
var app = angular.module('myapp', []); 
 

 
    app.controller('MainCtrl', function($scope) { 
 
$scope.choices = [{id: 'choice1', length:0, width: 0}, {id: 'choice2', length:0, width: 0}]; 
 

 
    $scope.addNewChoice = function() { 
 
    var newItemNo = $scope.choices.length+1; 
 
    $scope.choices.push({'id':'choice'+newItemNo}); 
 
    }; 
 

 
    $scope.removeChoice = function() { 
 
    var lastItem = $scope.choices.length-1; 
 
    $scope.choices.splice(lastItem); 
 
    }; 
 

 
    $scope.sum = function() { 
 
     var sum = 0; 
 
     angular.forEach($scope.choices, function(choice) { 
 
      sum += choice.length * choice.width; 
 
     }); 
 
     return sum; 
 
    } 
 
}); 
 
</script> 
 

 
</body> 
 
</html>

источник

2016-02-01 bhatt

Почему бы вам не написать пользовательский директивы для обработки все? –

Вам нужно определить переменную блока для того, чтобы получить к нему доступ , Например:

$scope.unit = ['mm', 'inch'];

источник

2016-02-01 10:42:35

Я изменил код только немного. Надеюсь, поможет!!

Добавлены опции {мм, см, м} с идентификатором для использования в качестве Division Factor.
Используемые опции в ng-опциях в раскрывающемся списке.
магазин предыдущие результаты и обновляет значения с помощью нг-изменения() событие

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

 
app.controller('MainCtrl', function($scope) { 
 

 
    $scope.change = function() { 
 
    if ($scope.data.previousSel != $scope.data.selectedOption) { 
 
     var diff = $scope.data.previousSel.id - $scope.data.selectedOption.id; 
 
     angular.forEach($scope.choices, function(choice) { 
 
     choice.length = Math.pow(10, diff) * choice.length; 
 

 
     choice.width = Math.pow(10, diff) * choice.width; 
 
     }); 
 
     $scope.data.previousSel = $scope.data.selectedOption; 
 
    } 
 
    }; 
 
    $scope.data = { 
 
    availableOptions: [{ 
 
     id: '1', 
 
     name: 'mm' 
 
    }, { 
 
     id: '2', 
 
     name: 'cm' 
 
    }, { 
 
     id: '4', 
 
     name: 'm' 
 
    }], 
 
    previousSel: { 
 
     id: '4', 
 
     name: 'm' 
 
    }, 
 
    selectedOption: { 
 
     id: '4', 
 
     name: 'm' 
 
    } //This sets the default value of the select in the ui 
 

 
    }; 
 
    $scope.choices = [{ 
 
    id: 'choice1', 
 
    length: 0, 
 
    width: 0 
 
    }, { 
 
    id: 'choice2', 
 
    length: 0, 
 
    width: 0 
 
    }]; 
 

 
    $scope.addNewChoice = function() { 
 
    var newItemNo = $scope.choices.length + 1; 
 
    $scope.choices.push({ 
 
     'id': 'choice' + newItemNo 
 
    }); 
 
    }; 
 

 
    $scope.removeChoice = function() { 
 
    var lastItem = $scope.choices.length - 1; 
 
    $scope.choices.splice(lastItem); 
 
    }; 
 

 
    $scope.sum = function() { 
 
    var sum = 0; 
 
    angular.forEach($scope.choices, function(choice) { 
 
     sum += choice.length * choice.width; 
 
    }); 
 
    return sum; 
 
    } 
 
});

<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body> 
 
    <div ng-app="myapp" ng-controller="MainCtrl"> 
 
    <p>Select a unit:</p> 
 
    <select ng-change="change()" ng-model="data.selectedOption" ng-options="option.name for option in data.availableOptions track by option.id"> 
 
    </select> 
 
    <form data-ng-repeat="choice in choices"> 
 
     Length: 
 
     <input type="number" ng-model="choice.length" />width: 
 
     <input type="number" ng-model="choice.width" />Area: 
 
     <input id="area" type="number" placeholder="Area" value="{{ choice.length * choice.width }}" /> 
 
     <button ng-show="$last" ng-click="removeChoice()">-</button> 
 

 
    </form> 
 

 
    <button ng-click="addNewChoice()">Add fields</button> 
 
    Result : {{ sum() }} 
 
    </div> 
 
</body> 
 

 
</html>

источник

2016-02-01 11:34:35 vCillusion

, вам дали отличную идею !!!! но мое требование - это изменение единицы на ноги и дюймы, также, так что, пожалуйста, можете ли вы помочь в этом, как сделать этот код будет работать на пихте ног и дюймов? – bhatt

, если вам действительно нужно масштабировать, вы можете выполнить что-то похожее на http://stackoverflow.com/a/27306114/1688718 – vCillusion

Как изменить единицы измерения с мм на дюйм или наоборот в angularjs для падения вниз выберите

ответ

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