如何在 Angular 中使用替换功能？答案

【问题标题】：How to use replace function with Angular?如何在 Angular 中使用替换功能？
【发布时间】：2017-01-24 17:04:25
【问题描述】：

我正在尝试做一个简单的双向绑定，但如果它包含两个单词字符串，则检查并更新输入文本。例如，如果输入是“喜剧电影”，那么

Comedy Movies ----> comedy_movies

我是通过类似 jQuery 的方式完成的

var str = $('#item').val()
if (str.match(/^[a-z\.]+ [a-z]+/i)) {
  str = str.replace(/\s+/g, '_').toLowerCase();
}

但不知道如何通过角度来做到这一点。我该如何解决这个问题？

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

<div ng-app>
    Item:
    <input type="text" ng-model="name" id="item"/>
      <br />
      <br />
    <div>{{name}}</div>
</div>

【问题讨论】：

标签： javascript jquery html angularjs regex

【解决方案1】：

您可以绑定使用包含您代码的函数的ng-bind - 请参阅下面的演示：

angular.module('app', []).controller('ctrl', function($scope) {

  $scope.name = 'Comedy Movies';

  $scope.getString = function() {
    var str = $scope.name;
    if (str.match(/^[a-z\.]+ [a-z]+/i)) {
      str = str.replace(/\s+/g, '_').toLowerCase();
    }
    return str;
  }

});

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

<div ng-app="app" ng-controller="ctrl">
  Item:
  <input type="text" ng-model="name" id="item" />
  <br />
  <br />
  <div ng-bind="getString()"></div>
</div>

【讨论】：