Массив не будет привязан к пользовательскому интерфейсу. В следующем примере

В HTML я использую таблицы данных

Переменная $ scope.successMessage также не привязана к пользовательскому интерфейсу

Я пробовал много способов, но не работает

HTML-страница:

<div class="box-body table-responsive">
   <table id="mktable" datatable="ng" class="table table-bordered"
      dt-options="dtOptions">
      <thead>
         <tr>
            <th>Account Number</th>
         </tr>
      </thead>
      <tbody>
         <tr ng-repeat="rows in accNum">
            <td>{{rows.ID}}</td>
         </tr>
      </tbody>
   </table>
</div>

В JS у меня есть следующий код:

 mApp.controller('mobileNumberCtrl', function($scope, $rootScope, $state, $compile, DTOptionsBuilder, $location, Connect) {


 $scope.accNum = [];
 $scope.wId = {};
 $scope.dtOptions = DTOptionsBuilder.newOptions()
     .withDisplayLength(10).withOption('scrollX', '100%');

 var requestURL = "http://10.80.49.149:8080/PhonePeService/firstReq";

 $scope.getAccNum = function() {

     for (var i = 0; i < $rootScope.accNumList.length; i++) {
         var wId = {
             ID: $rootScope.accNumList[i]
         }
         $scope.accNum.push(wId);
         console.log($scope.accNum);
     }

     return $scope.accNum;
 }

 Connect.getDataFromServer(requestURL, getDetailsRequest)
     .success(function(response, data, status, headers, config) {


         if (response.TranIdValRes.TranValRes.Status.toUpperCase() == "SUCCESS") {

             $rootScope.accNumList = response.TranIdValRes.TranValRes.AccNum;

             $scope.successMessage = "success";
             $scope.getAccNum();

             $scope.accNum = JSON.stringify($scope.accNum);

             $state.go('firstRes');

         } else {
             $("#errorModal").modal("show");
             $scope.error = "No records available in system."
         }


     }).error(
         function(data, status, headers, config) {
             // do something
             console
                 .log("Unable to contact server. Kindly try again later");
             alert("failure");
             // $scope.error = "We are facing
             // some technical issues while log
             // out. Please Login after
             // some time.";

         });

}});

В app.js у меня есть следующий код:

.state("firstRes", {
                  cache: false,
                  url:'/firstRes',
                  views:{

                      content : {templateUrl: 'templates/firstRes.html',controller: 'mobileNumberCtrl'}
                  }
                }) 

В чем проблема в приведенных выше строках кода?

-1
kashi viswanath 2 Янв 2018 в 15:39

2 ответа

Лучший ответ

Проверьте, включены ли вы ng-app и ng-controller в свой шаблон.

ДЕМО

var app =angular.module('testApp', []);
app.controller('testCtrl', function($scope) {
  $scope.accNum = [{"ID":"309001259753"},{"ID":"309000137788"},{"ID":"309001335532"}];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="testApp" ng-controller="testCtrl">
  <table>
    <tr ng-repeat="accNo in accNum">
      <td>{{accNo.ID}}</td>
    </tr>
  <table>
</body>
3
Mohammad Usman 2 Янв 2018 в 13:14

Работает абсолютно нормально. Ниже приводится полный код:

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body ng-app="myApp">

<table ng-controller="myCtrl" border="1">
<tr ng-repeat="x in accNum">
  <td>{{x.ID}}</td>
</tr>
</table>

<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.accNum=[{"ID":"309001259753"},{"ID":"309000137788"}, {"ID":"309001335532"}] 
});
</script>

</body>
</html>
0
Dheeraj Jain 2 Янв 2018 в 13:06