JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.min.js"></script>
<div ng-controller="MyCtrl">
    <p ng-repeat="i in list | random">{{i}}</p>
</div>

JavaScript

var myApp = angular.module('myApp',[]);

myApp.filter('random', function() {
          return function(a) {

              var r = [];
              while (a.length)
                r.push(
                  a.splice((Math.floor(Math.random() * a.length)), 1)[0]
                );
              return r;
          }
        }

function MyCtrl($scope) {
    $scope.list = [
  {
    "codeVille": 1,
    "nomVille": "Casablanca"
  },
  {
    "codeVille": 2,
    "nomVille": "Rabat"
  },
  {
    "codeVille": 3,
    "nomVille": "Tanger"
  },
  {
    "codeVille": 4,
    "nomVille": "Marrakech"
  },
  {
    "codeVille": 5,
    "nomVille": "Tetouan"
  },
  {
    "codeVille": 6,
    "nomVille": "Azilal"
  },
  {
    "codeVille": 7,
    "nomVille": "Beni Mellal"
  },
  {
    "codeVille": 8,
    "nomVille": "El Jadida"
  },
  {
    "codeVille": 9,
    "nomVille": "Agadir"
  },
  {
    "codeVille": 10,
    "nomVille": "Al Hoceima"
  },
  {
    "codeVille": 11,
    "nomVille": "Aoussered"
  },
  {
    "codeVille": 12,
    "nomVille": "Assilah"
  }
  ];

}