JSFiddle - React, Tailwind, and code Playground

by remguif

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script src="https://vitalets.github.io/angular-xeditable/dist/js/xeditable.js"></script>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://vitalets.github.io/angular-xeditable/dist/css/xeditable.css">
<div  ng-controller="mainCtrl">
    <span  class="list-group-item">
    <span editable-text="model.zip_code" e-typeahead="city for city in Zip_City_options | filter:$viewValue | limitTo:8">
          {{ zip_code || '58.29C' }}
   </span>                  

   </span>
   </div>

JavaScript

var payApp = angular.module('payRoll', ["xeditable", "ui.bootstrap"]);

    payApp.controller('mainCtrl', function($scope, $http, $window,$location, $filter) {
    $scope.Zip_City_options = ["1000  BOURG EN BRESSE",
        "1000  BROU",
        "1000  ST DENIS LES BOURG",
        "1090  AMAREINS",
        "1090  AMAREINS FRANCHELEINS CES",
        "1090  CESSEINS",
        "1090  GENOUILLEUX",
        "1090  GUEREINS",
        "1090  LURCY",
        "1090  MONTCEAUX",
        "1090  MONTMERLE SUR SAONE",
        "1100  APREMONT",
        "1100  ARBENT",
        "1100  BOUVENT",
        "1100  GEOVREISSET",
        "1100  OYONNAX",
        "1100  VEYZIAT",
        "1110  ARANC",
        "1110  BRENOD",
        "1110  CHAMPDOR",
        "1110  CORCELLES"];

    $scope.model = {
       zip_code: null
    };
});