Javascript 如何在具有角度材质设计的输入字段上保留占位符字符

查看上图，您可以通过向材质设计/角度指令添加占位符属性来添加美元符号（$）。当您关注输入并添加文本时，美元符号将消失。有没有办法在CSS或其他我可以保持美元符号

 <md-input-container >
    <label>Tens ($10.00's)</label>
    <input name="tens" ng-model="data.tens" placeholder="$">
  </md-input-container> 

十美元（10.00美元）

也许您可以尝试ng change，在输入中添加ng change=“change（）”

$scope.change = function () {
    if ($scope.data.tens === "$") {
        $scope.data.tens = "";
    }
    else if (!$scope.data.tens.startsWith('$')) {
      $scope.data.tens = '$' + $scope.data.tens;
    }
};

---

也许您可以尝试ng change，将ng change=“change（）”添加到输入中

$scope.change = function () {
    if ($scope.data.tens === "$") {
        $scope.data.tens = "";
    }
    else if (!$scope.data.tens.startsWith('$')) {
      $scope.data.tens = '$' + $scope.data.tens;
    }
};

---

根据您使用

ng型号的方式

您可以将美元符号作为其中的一部分-只需确保不让用户删除字符即可

<input name="tens" ng-model="data.tens">

---

根据您使用

ng型号的方式

您可以将美元符号作为其中的一部分-只需确保不让用户删除字符即可

<input name="tens" ng-model="data.tens">

---

虽然很多人建议使用掩码或Javascript，但如果您想要的是一个类似占位符的选项，我还要补充一点，您可以使用CSS来做同样的事情

CSS:

HTML:

十美元（10.00美元）
$

虽然许多人建议使用掩码或Javascript，但如果您想要的是类似占位符的选项，我还想补充一点，您可以使用CSS来实现同样的功能

CSS:

HTML:

十美元（10.00美元）
$

您是否尝试将美元符号置于输入之外？要么这样，要么将其作为

ng模型的一部分，但这可能不是最好的主意。这是占位符的正常行为。也许你在找一个面具。我想这个答案可以解释为什么你不能这样做，为什么你不应该：@oguzhan00回答得好，但他没有引导标签。谢谢你，你说得对，但我知道，如果没有一些Js、html或css的解决方法，这仍然是不可能的。Angular material没有用于此操作的任何标记或指令。是否尝试将美元符号置于输入之外？要么这样，要么将其作为
ng模型的一部分，但这可能不是最好的主意。这是占位符的正常行为。也许你在找一个面具。我想这个答案可以解释为什么你不能这样做，为什么你不应该：@oguzhan00回答得好，但他没有引导标签。谢谢你，你说得对，但我知道，如果没有一些Js、html或css的解决方法，这仍然是不可能的。Angular material没有用于此操作的任何标记或指令。我收到一个错误，该错误表示“@CodedContainer无法读取undefined”的属性“length”，这意味着newValue可能为null。十是以值开头的吗？将其实例化为空字符串我不想将该值作为空字符串启动，因为我想让用户知道输入应作为货币值添加。@CodedContainer抱歉，我的意思是实例化的值应为
“$”
@CodedContainer否，占位符与模型中的
tens
值是分开的。我得到一个错误，上面写着“无法读取未定义的@CodedContainer的属性'length'，这意味着newValue可能为null。十是以值开头的吗？将其实例化为空字符串我不想将该值作为空字符串开始，因为我想让用户知道输入应作为货币值添加。@CodedContainer抱歉，我的意思是实例化的值应为
“$”
@CodedContainer否，占位符与模型中的
tens
值分开。
<md-input-container>
    <label>Tens ($10.00's)</label>
    <i class="dollar-sign-icon">$</i>
    <input class="dollar-input" name="tens" ng-model="data.tens" placeholder="$">
</md-input-container>