Javascript angularjs输出中的计算因ng模型而失败

我正在做一个角度项目，我在页面上进行计算。在我放置最终结果的文本字段中，当我得到一个

ng模型时，答案无法加载。当我取出
ng型号
时，答案出现了。
但我希望它在有ng model=“total”的情况下工作，因为我会将总值发送到数据库。使用下面的脚本，它可以工作

<input name="price" type="text"  id="price" ng-model="price">
<input name="quantity" type="text"  id="quantity"ng-model="price">
<input name="total" type="text"  id="total" value="{{.price*quantity}}">



但是有了这个

 <input name="price" type="text"  id="price" ng-model="price">
    <input name="quantity" type="text"  id="quantity"ng-model="price">
    <input name="total" type="text"  id="total" value="{{.price*quantity}}" ng-model="total">



它不起作用。答案不会出现在文本框中，请尝试以下操作：

<input name="price" 
       type="text"
       ng-model="price" string-to-number>

<input name="quantity" 
       type="text"
       ng-model="quantity" string-to-number>

<span>{{ price * quantity }}</span>


{{价格*数量}

我不确定您为什么要将计算出的值放入第三个输入中，但如果是这样，您将希望使用
ng model options
告诉整个ngModel，将该值视为getter/setter-

还要注意
字符串到编号
指令。您正在处理输入中的字符串。因此，为了使插值有效，您可能需要添加这些

编辑
下面是一个工作示例，我认为您是如何尝试允许覆盖计算值的。您可以在total input中输入另一个值，然后按enter键查看其工作情况。这将使用
ng型号选项
-
尝试以下操作：

<input name="price" 
       type="text"
       ng-model="price" string-to-number>

<input name="quantity" 
       type="text"
       ng-model="quantity" string-to-number>

<span>{{ price * quantity }}</span>


{{价格*数量}

我不确定您为什么要将计算出的值放入第三个输入中，但如果是这样，您将希望使用
ng model options
告诉整个ngModel，将该值视为getter/setter-

还要注意
字符串到编号
指令。您正在处理输入中的字符串。因此，为了使插值有效，您可能需要添加这些

编辑
下面是一个工作示例，我认为您是如何尝试允许覆盖计算值的。您可以在total input中输入另一个值，然后按enter键查看其工作情况。这使用了
ng型号选项
-
谢谢您的回答。成功了。你能帮我调查一下吗？谢谢你的回答。成功了。你能帮我调查一下吗？