函數調用服務僅在初始化時起作用

AngularJS入門通過W3schools教程開始。函數調用服務僅在初始化時起作用

我試圖通過創建一個輸入來使用函數getHex（），它使用服務hexafy來擴展一些示例代碼。

<div ng-app="myApp" ng-controller="myCtrl">  
    <p>The hexadecimal value of <input ng-model="inputNo"/> is:</p>  
    <h1>{{getHex()}}</h1> 
</div> 

<p>A custom service with a method that converts a given number into a hexadecimal number.</p> 


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

app.service('hexafy', function() { 
    this.myFunc = function (x) { 
     return x.toString(16); 
    } 
}); 
app.controller('myCtrl', function($scope, hexafy) { 
    $scope.inputNo = 255; 
    $scope.getHex = function() { 
     return hexafy.myFunc($scope.inputNo); 
    }; 
}); 
</script>

當頁面首創負載，輸入包含255和{{getHex（）}}呈現爲FF，因此函數似乎正常運行。

但是，當我改變輸入值時，它只是將我的輸入正確地返回到{{getHex（）}}而無需對其進行十六進制化。 getHex（）應該返回hexafy.myFunc的結果。

來源

2017-05-25 SeanOB

轉換$scope.inputNo發送到服務

return hexafy.myFunc(parseInt($scope.inputNo));

Demo

來源

2017-05-25 06:21:38

這似乎功能上等同於我的示例代碼。我也在更新html {{getHex（）}}，但我沒有得到預期的值。例如，最初在頁面加載時運行時，255會以ff的形式返回。但是，當我將該值更改爲254時，它將返回254.如果我輸入255，則返回255.它僅在頁面首次加載時返回輸入的十六進制值。 – SeanOB

任何想法爲什麼它在初始加載時正確地呈現ff呢？ – SeanOB

，因爲它最初是一個整數。但是當你改變它的輸入時，它會轉換爲字符串類型 –

轉換爲十六進制轉換之前發送有效載荷到JavaScript Number之前爲int。

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

 
app.service('hexafy', function() { 
 
    var hexafyService = {}; 
 

 
    var _myFunc = function(x) { 
 
    return Number(x).toString(16); 
 
    } 
 

 
    hexafyService.myFunc = _myFunc; 
 
    return hexafyService; 
 
}); 
 

 
app.controller('myCtrl', function($scope, hexafy) { 
 
    $scope.inputNo = 200; 
 
    $scope.getHex = function() { 
 
    $scope.hexNo = hexafy.myFunc($scope.inputNo); 
 
    }; 
 
    $scope.getHex(); 
 

 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <p>The hexadecimal value of <input ng-model="inputNo" ng-change="getHex()" /> is:</p> 
 
    <h1>{{hexNo}}</h1> 
 
</div> 
 

 
<p>A custom service with a method that converts a given number into a hexadecimal number.</p>

來源

2017-05-25 06:37:29 Sajal

函數調用服務僅在初始化時起作用

回答

相關問題