更新輸入值

我正在使用AngularJS構建鼓機，並從用戶界面調整節奏。更新輸入值

我有對象「this.tempo=120」 &「<input class="bpm-input" type="number" onchange="updateBPM()" min="100" max="150" ng-model="$ctrl.tempo"></input>」

這似乎並沒有更新tempo值，只有在輸入框中顯示的值。

我需要什麼函數來更新控制器內的值？

來源

2017-05-05 N92

這很正常，當您使用AngularJS時，您需要使用Angular WAY。

換句話說，你做什麼角度是唯一的方法來做到這一點。

AngularJS大幅度控制您的DOM並將其用作副本。

如果更改沒有角度行爲的DOM，則角度無法更新其副本並引發不良行爲。

你需要使用所有的Angular事物來告訴他在你的DOM上運用他的魔法。

將您的onclick屬性更改爲ng-click角度指令，將您的updateBPM放入您的控制器範圍，這將起作用。

希望能幫到你！

來源

2017-05-05 14:52:17 john

基本的東西，你可以做的是作爲附加的片段也嘗試具有Patterns

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

 
<div ng-app="myApp" ng-controller="myController as myCtrl"> 
 

 
    <input class="bpm-input" type="number" ng-change="myCtrl.updateBPM()" min="100" max="150" ng-model="myCtrl.tempo"></input> 
 
    
 
    
 
</div> 
 

 
<script> 
 
var app = angular.module('myApp', []); 
 
app.controller('myController', function($scope) { 
 
    var myCtrl = this; 
 
    myCtrl.tempo=120; 
 
    myCtrl.updateBPM = function(){ 
 
    alert(myCtrl.tempo); 
 
    }  
 
}); 
 
</script> 
 
</body> 
 
</html>

來源

2017-05-05 15:03:16

代碼附加以下

可管理代碼基礎和良好的性能角度模式

<script> 
    var mainModule = angular.module('mainModule', []) 
    .controller('mainCntrl', function($scope) { 
     var vm = this; 
     vm.tempo = 120; 
    }); 
</script> 


<div ng-app="mainModule"> 
    <div ng-controller="mainCntrl as ctrl"> 
    <input class="bpm-input" type="number" min="100" max="150" ng-model="ctrl.tempo"></input> 
    </div> 
</div>

來源

2017-05-07 12:37:05

回答

相關問題