Api没有点击并显示数据

时间:2017-02-20 06:21:29

标签: angularjs html5

我通过Html发送数据并通过api获取数据以显示在表格中: -

<div class="form-group">
     <label>Service:</label>
       <select id="Service" ng-model="a.service">
            <option>value1</option>
            <option>value2</option>
            <option>value3</option>
       </select> 
       <label>Data_SER:</label>
         <select id="Data_SER" ng-model="a.data">
              <option>data1</option>
               <option>data2</option>
              <option>data3</option>
          </select>

       <label class="col-md-5">Symbol:</label>
          <input type="text" ng-model="a.symbol"/>

       <label class="col-md-6">Price</label>
          <input type="number" step="any" ng-model="a.price"/>

       <label class="col-md-5">Date:</label>
           <div class='input-group date' id='Date'>
                <input type='text' ng-model="a.Date" name="date" class="form-control"/>
                     <span class="input-group-addon">
                         <span class="glyphicon glyphicon-calendar"></span>
                          </span>
            </div>
       <button type="button" class="btn btn-info btn-md" ng-click="getValue()">Fetch</button>
           </div>
         </div>
       <table cellpadding="0" cellspacing="0">
                  <thead>
                    <tr>
                      <th>col1</th>
                      <th>col2</th>
                      <th>col3</th>
                      <th>col4</th>
                      <th>col5</th>
                      <th>col6</th>
                      <th>col7</th>
                      <th>col8</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr ng-repeat="row in values">
                      <td>{{row.col1}}</td>
                      <td>{{row.col2}}</td>
                      <td>{{row.col3}}</td>
                      <td>{{row.col4}}</td>
                      <td>{{row.col5}}</td>
                      <td>{{row.col6}}</td>
                      <td>{{row.col7}}</td>
                      <td>{{row.col8}}</td>
                    </tr>
                  </tbody>
                </table>

我的指令代码是: -

(function () {
    'use strict';
    angular.module('myApp.components')
        .directive('sevice', service);

    service.$inject = ['$http','$timeout','ApiServices'];

    function service($http, $timeout,ApiServices) {
        return {
            restrict: 'EA',
            scope: {

            },

            link: function (scope, el, attrs) {
                scope.a = {};
               scope.activateDatePicker = function () {
                        $('#date').datetimepicker({
                            format: 'DD-MMM-YYYY',
                            showClose: true,
                            allowInputToggle: true,
                            widgetPositioning: {
                                horizontal: 'right',
                                vertical: 'auto'
                            }
                        });
                    };

                 scope.getValue = function () {
                    scope.a.Date = Date.parse($('input[name="date"]').val());
                    scope.a.Date = moment(scope.a.Date).format('DD-MMM-YYYY').toUpperCase();
                    scope.a.key = scope.a.service+ '' +scope.a.data+ '' +scope.a.symbol+ '' +scope.a.Date;
                    ApiServices.getValue(scope.a.key).then(
                        function (response) {
                            scope.values = response.data;
                            },
                                function (err) {
                                    // Handle error here
                                    console.log('Error' + JSON.stringify(err.data));
                                });
                   };

                    scope.activate = function () {
                    scope.activateDatePicker();
                };
                scope.activate();

            },
            templateUrl: 'js/components/folder/sevice_data.html'
        };
    }

})();

我的api代码是: -

getValue: getValue,
function getValue(key) {
            console.log(key);
           return  $http({
                method: 'GET',
                url: '/api/services/' + key
            });
        }

当我点击api时,我在控制台errorNull中没有得到任何响应或消息,我想我在代码中写错了。任何人都可以帮助我。

0 个答案:

没有答案