带有数字的离子+变量总是“不是一个有效的数字”

Question

在我的页面中，我使用来自页面控制器的变量。例如：

<label class="item item-input item-stacked-label">
  <span class="input-label">Projekt Id:</span>
  <input type="number" placeholder="0" value="{{cpc.projektid}}" disabled>
</label>

控制器对工厂进行一些计算，并从SQLite数据库获得一些数据。如果我检查控制器或工厂中变量的类型，例如：

console.log(typeof cpcVm.projektid); => number
console.log(angular.isNumber(cpcVm.projektid)); 0> true

所以对我来说，这意味着变量的值是一个数字！？

但我总是得到警告：

指定的值“{{cpc.projektid}”不是有效数字。该值必须与以下正则表达式匹配：-?(\d+|\d+.\d+|.\d+)(eE?\d+)?“

对于projektid来说，这不是一个大问题，但我有更复杂的计算，我还需要设置一些过滤器，只有当数字是一个数字时才能工作。例如：

<input type="number" placeholder="0" value="{{cpc.luftmenge | number:2}}" disabled>

我已经尝试在我的控制器和工厂中提供一个额外的parseFloat()，但是没有改变。控制器和工厂说它是一个数字，但是在HTML中它会产生一个错误，我不能使用过滤器。

另一件奇怪的事情是:如果我手动设置工厂中的变量或控制器的值(例如，返回12;)，那么它就能工作了。

有什么想法吗？

Answer 1

使用ng-value="cpc.projektid"而不是value属性。

在页面中没有加载角之前，浏览器将在value属性中看到的是{{cpc.projektid}}，这就是它抱怨的原因。ng-value确保只有在表达式正确编译后才会添加value属性。

​

var app = angular.module("sa", []);

app.controller("FooController", function($scope) {

  $scope.projektid = "2"
});

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

<div ng-app="sa" ng-controller="FooController">
  Projekt Id:
  <input type="number" placeholder="0" ng-value="projektid" disabled>
</div>

​