<section id="inflector">
  <div class="page-header">
    <h1>Inflector</h1>
  </div>
  <h3>What?</h3>

  <p>Converts a string to an alternative format.</p>

  <div class="well">
    <p>
      <label><input type="radio" value="humanize" ng-model="inflectorType"> Humanize (Default)</label>
      <label><input type="radio" value="underscore" ng-model="inflectorType"> Underscore</label>
      <label><input type="radio" value="variable" ng-model="inflectorType"> Variable</label>
    </p>

    <p><input placeholder="Enter some text to inflect" ng-model="inflectorText"></p>

    <p>{{inflectorText|inflector:inflectorType}}</p>
  </div>

  <h3>How?</h3>
<pre class="prettyprint">
&lt;label&gt;&lt;input type=&quot;radio&quot; value=&quot;humanize&quot; ng-model=&quot;inflectorType&quot;&gt; Humanize (Default)&lt;/label&gt;
&lt;label&gt;&lt;input type=&quot;radio&quot; value=&quot;underscore&quot; ng-model=&quot;inflectorType&quot;&gt; Underscore&lt;/label&gt;
&lt;label&gt;&lt;input type=&quot;radio&quot; value=&quot;variable&quot; ng-model=&quot;inflectorType&quot;&gt; Variable&lt;/label&gt;

&lt;input placeholder=&quot;Enter some text to inflect&quot; ng-model=&quot;inflectorText&quot;&gt;
&lt;p&gt;{{inflectorText|inflector:inflectorType}}&lt;/p&gt;

&lt;script&gt;
$scope.inflectorText = &#x27;Here Is my_phoneNumber&#x27;;
$scope.inflectorType = &#x27;humanize&#x27;;
&lt;/script&gt;
</pre>
</section>