title: Create list cards dynamically angularjs dashboard
body: <p>I have inside of <code>&lt;div class="row"&gt; &lt;/div&gt;</code> four card element like this photo</p>
  
  <p><a href="https://i.stack.imgur.com/tHAl4.png" rel="nofollow noreferrer">cards</a></p>
  
  <p><img src="https://i.stack.imgur.com/tHAl4.png" alt=""></p>
  
  <p>I edited the code of first element. (<a href="https://github.com/coreui/coreui-free-bootstrap-admin-template" rel="nofollow noreferrer">source code</a>)</p>
  
  <pre><code>    &lt;div class="col-sm-6 col-lg-3"&gt;
        &lt;div class="card text-white bg-primary" ng-controller="cardChartCtrl1"&gt;
          &lt;div class="card-body pb-0"&gt;
            &lt;div class="btn-group float-right"&gt;
            &lt;/div&gt;
            &lt;h4 class="mb-0"&gt;9.823&lt;/h4&gt;
            &lt;p&gt;Members online&lt;/p&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>I would like to know how can I dynamically create a list of cards according a sensor list I will get from API json format.</p>
  
  <p>currently each cards is independent with own controller (piety I'm new to web programming, angularjs)</p>
  
  <p>I would like to have some link this:</p>
  
  <p><a href="https://i.stack.imgur.com/1nrIU.png" rel="nofollow noreferrer">idea</a></p>
  
  <p><img src="https://i.stack.imgur.com/1nrIU.png" alt=""></p>
  
  <p>How to make the code for angularjs ? (color depend of value)</p>